动态元素并监听它们上的事件

时间:2014-12-31 18:48:17

标签: javascript php jquery ajax

我有一个页面上的电子邮件列表。

 echo "<div class='comms'>";
 $sel = "SELECT * from emails where customerId=:custId";
 $stmt = $db->prepare($sel);
 $stmt->bindParam(':custId',$_POST['custId']);
 $stmt->execute();
 while($r = $stmt->fetch())
 {
    echo "<li class='emails'>" . $r['date']. " " . substr($r['data'],0,15) . "....</li>";
 }
 echo "</div>";

我每分钟都有一个ajax电话来检查新电子邮件。

    var getMail = function(){
            var custId = "<?php echo $_POST['custId'];?>";
    $.ajax({
            type:"POST",
                    url:"installManager/getMail.php",
                    data:"custId="+custId,
            success: function(result){
                    $('.comms').html(result);
            }
            });
    }
    var interval = 1000 * 60 * 1;
    setInterval(getMail,interval);

我正在设置将侦听事件悬停在这些新创建的li上。

    $('.emails').on('mouseover',$('li'),function(){
                    alert('this is an email');
    });
在ajax开火后,

悬停不会触发。我做错了什么?

2 个答案:

答案 0 :(得分:3)

试试这个

$('.comms').on('mouseover', 'li.emails', function(){
   alert('this is an email');
});

答案 1 :(得分:2)

您的.emails元素会被替换,因此您需要再次绑定悬停操作或使用动态绑定:

$('.comms').on('mouseover', '.emails', function(){
    alert('this is an email');
});