JavaScript 未在 PHP 加载的 HTML 上运行答案

【问题标题】：JavaScript Not Running On PHP Loaded HTMLJavaScript 未在 PHP 加载的 HTML 上运行
【发布时间】：2015-11-05 21:17:51
【问题描述】：

我有一个公告系统，我从数据库中提取所有公告并使用 Ajax 和 PHP 将它们显示在屏幕上。

这里是将每个公告加载到页面上的代码：

echo '<div id="announcements_container">';
for ($i = $start; $i <= $end; $i++) {
    ?>
        <script>
            formatAnnouncement("<?php echo $announcements[$i]->id; ", ..., ..., ...);
        </script>
    <?php
}
echo '</div>';

这是我的函数，它将接收到的数据发送到 PHP 并返回格式化的公告。

function formatAnnouncement(id, subject, body, urgent, attachment1, attachment2, poster, time_posted) {
    $.ajax({
        type: "POST",
        url: "<?php echo base_url().'application/views/user/announcement_block.php'; ?>",
        data: {id : id, subject : subject, body : body, urgent : urgent, attachment1 : attachment1, attachment2 : attachment2, poster : poster, time_posted : time_posted},
        success: function(response) {
            $("#announcements_container").prepend(response);
        }
    });
}

这成功地返回并格式化了一个名为 <div class="announcement_block"></div> 的周围 div 中的数据，但问题是，我的 JavaScript 对此元素的引用不起作用。

换句话说，

$(window).load(function () {
    $(".announcement_block").hover(
              function() {
                console.log("Did it work?");
      $(this).find(".announcement_actions").find(".action_edit").append('<input type="button" onclick="updateAnnouncement($(this).parent().parent())" class="btn btn-info btn-lg" style="font-size: 10pt; width: 2em; padding: 0px; padding-top:5px;" value="Edit">&nbsp;&nbsp;');
                    $(this).find(".announcement_actions").find(".action_delete").append('<input type="submit" class="btn btn-info btn-lg" style="font-size: 10pt; background-color: #EB5F6B; width: 2.5em; padding: 0px; padding-top:5px;" value="Delete">');
              }, function() {
                $(this).find(".announcement_actions").find(".action_edit").empty();
                $(this).find(".announcement_actions").find(".action_delete").empty();
              }
            );
});

该代码块不起作用。当 HTML 在 for 循环中加载时，它曾经可以工作。但现在它不再是通过 Ajax 加载的了。

每当我将鼠标悬停在块上时，都不会运行任何代码，因为 console.log 永远不会输出。

谁能帮帮我？谢谢。

【问题讨论】：

标签： javascript php jquery html ajax

【解决方案1】：

试试这个：

$(document).on({
    mouseenter: function () {
        //stuff to do on mouse enter
    },
    mouseleave: function () {
        //stuff to do on mouse leave
    }
}, ".selector");

类似问题的好答案here

【讨论】：