php - 无论我点击什么 div，jquery 总是隐藏相同的 div

Question

我使用 codeigniter 构建了一个应用程序，并且我有一个显示用户消息的消息系统，这是通过 foreach 语句完成的。我在后台有一些 JS，一旦用户单击“删除”特定消息，该消息就会从 View 中隐藏，而 JS 会将消息 ID 发布到我的 Controller 并将该消息标记为已删除。但是发生的事情是，一旦用户单击删除，仅隐藏第一条消息(仅隐藏第一个 foreach 值)，但所有其他消息都有单独的 ID，但不响应删除点击。我还应该注意，如果我点击任何消息的“删除”，第一条消息会隐藏，而不是我点击的消息。

这里是一些代码:

查看

<?php foreach ($rows as $r) : ?>
<li id="notification_<?php echo $r['MID']; ?>"><?php echo anchor("$r[MID]", 'X', array('class'=>'delete', 'rel'=>"$r[MID]")); ?>
<p>
<?php echo anchor("headless/view_msg/$r[MID]", $r['head'], array('rel'=>'notifications')); ?>
<?php if(strlen($r['body'] >= 74)) : ?>
<?php echo $r['body']; ?>
 <?php else : ?>
<?php echo substr($r['body'], 0, 74) . "..."; ?>
<?php endif; ?>
</p>
</li>
<?php endforeach; ?>

JS:

    $("a.delete").click(function(eve) {
    eve.preventDefault();

    var MID = $("a.delete").attr('rel');

    $.post('headless/notification_read', {
        MID: MID},

    function(html){
        if(parseFloat(html)){

            $('#notification_' + MID).hide('slow')
            console.log('success');

        }else{

            console.log('fail');
        }
    })

});

我不确定这里发生了什么，但我的猜测是 javascript 仅链接第一个 foreach 而不是其余部分(如果是这样我将如何解决这个问题)

如有任何帮助，我们将不胜感激。

谢谢。

Answer 1

$("a.delete").click(function(eve) {
    eve.preventDefault();

    var MID = this.rel; // `this` would be the element being clicked on....
    //var MID = $("a.delete").attr('rel'); this line is the problem....

    $.post('headless/notification_read', {
        MID: MID},

    function(html){
        if(parseFloat(html)){

            $('#notification_' + MID).hide('slow')
            console.log('success');

        }else{

            console.log('fail');
        }
    })
});

demo with comments