javascript - 如何在 AJAX 返回的 HTML 中调用 jQuery 函数

Question

我有一个页面，我在其中发布了帖子，用户可以发表评论。使用 AJAX 处理评论。每个评论行都有一个“投票”按钮。

在索引页中，我放置了用于投票的 jQuery 函数

<script type="text/javascript">
$(function()    {
         $('.voteUpBtn').click(function() {
               // Cast your vote
          }
     }
</script>

现在，当用户提交新评论时，它会调用 AJAX 并使用 jQuery 将 HTML 附加到索引页面

$.ajax({
        type: "POST",
        url: "proc/add-line.php",
        data: dataString,

        cache: false,
        success: function(html){
            $("ul#nextLines").append(html);
        }
    });

在附加的 HTML 上，我有相同的投票按钮。 (每条评论都有对应的投票按钮)。

问题是，AJAX 生成的新评论上的“投票”按钮不起作用。如果我刷新页面，则投票有效(尽管我使用的是相同的标记)。

如何使投票按钮在 AJAX 返回的 HTML 中起作用？

Answer 1

使用live代替click:

$('.voteUpBtn').live('click', function() {
    // Cast your vote
}