Question

当用户点击链接时，它会运行$.post以检索一些数据并显示它。其中一个链接用每个会话旁边的按钮拉出一个会话表。以下是其中一个按钮的代码：

<button class="view_session btn btn-info" id="3f87d50493698d06b9b48abe36cd8fc8">Details</button>

这是我的jQuery函数：

$('.view_session').click(function(){
    $('#blanket').show();
    $('#load').show();
    $.post("admin/session.php", { id: $(this).attr('id') }, function(data){
        $('#sort').html(data);
        $('#first').hide();
        $('#load').hide();
        $('#blanket').hide();
    }); 
});

但没有任何反应。我输入Console.log进行测试，没有触发任何内容。我有什么必须做的，因为在页面最初加载后创建了按钮吗？

Answer 1

如果您动态添加按钮，.click将不会绑定到它，除非它已经存在。您需要在按钮添加到DOM之后绑定或使用委托，如下所示：

$(document).on('click', '.view_session', function () {

（比document更具体的选择器会很好。）

除此之外，作为$.post函数的第三个参数仅在成功时发生。您也可以使用延迟接口方法来检查故障和完成情况：

$.post(...).then(success).fail(failure).done(complete);

Answer 2

我是否有必要做的事情，因为正在创建按钮页面最初加载后？

是

原因是处理程序附加到jQuery对象中当前选定的元素，因此这些元素必须存在于绑定发生的位置。

解决方案是您必须手动将事件重新绑定到已添加的元素或使用委托绑定事件。

对于jQuery 1.7或更高版本，请使用on() with delegation：

$("#YourclosestStaticElement").on("click", ".view_session", function () {
   //... same code as before
}

对于jQuery 1.4.3 up-to / includes 1.6使用delegate()：

$("#YourclosestStaticElement").delegate(".view_session", "click", function () {
   //... same code as before
}

对于jQuery 1.3 up-to /包括1.4.3 live()将是唯一的方法，除了手动重新绑定：

$(".view_session").live("click", function () {
   //... same code as before
}

此外，live()被删除的原因有很多，其中事实是它在触发事件之前总会冒泡到文档中，这意味着stopPropogation()可能成为一个问题。

完整的原因列表也在live()文档中。

引用documentation：

$（selector）.live（events，data，handler）; // jQuery 1.3 +

$（document）.delegate（selector，events，data，handler）; // jQuery 1.4.3 +

$（document）.on（事件，选择器，数据，处理程序）; // jQuery 1.7 +

jQuery函数不使用已加载Ajax的数据

2 个答案: