-2

我有一个包含所有需要的 jquery 函数的主包装器 html 块。根据用户单击的内容,ajax 调用会进行一些调用并将内部内容 div 替换为返回的 html。新位置 HTML 中的按钮没有从包装器 html 注册 .click 函数。单击它们没有任何作用。

检查源代码,jquery 函数仍然存在,因此它们没有被删除或替换。

一些代码:

这是我正在使用的 jquery 函数。它检查按钮单击。如果是这样,它会进行调用,然后将内容 div 替换为返回的 html。这个新的 html 将替换包含前一个按钮的 html,但它将包含它自己的具有相同 id 的按钮。这个新按钮没有使用 jquery 函数注册它的点击。

jQuery("#newhtml").click(function() {
    var ajaxurl = "urltogetnewhtml";
    new Ajax.Request(ajaxurl, {
        method: 'post',
        onComplete: function(transport) {
           jQuery('#content').html(transport.responseText);
        }
    });
});

换句话说,它第一次起作用,但不再起作用。单击“New Html”按钮,将内容块替换为新的 html,包括一个名为“New Html”的新按钮。这个新按钮不起作用,即使 jquery 代码仍然存在。

4

6 回答 6

1

由于 HTML 是动态添加的,因此 .click 函数将不起作用。添加 HTML 后,您需要再次调用定义点击的函数。您可以使用

$('#container').html(data);

$('#container').on('click', '.thumbnail', function(event){
 // do stuff
});
于 2013-05-15T18:01:18.057 回答
1

点击功能在这里不起作用。使用jQuery.on()函数绑定页面加载后添加的元素上的事件。您可以使用此函数绑定任何事件。更多详情,请访问:http ://api.jquery.com/on/

而 Click 事件绑定在页面加载时加载的元素上。

您可以使用 :

$("#dataTable tbody tr").on("click", function(event){
  alert($(this).text());
});

或者

$("#dataTable tbody").on("click", "tr", function(event){
  alert($(this).text());
});
于 2013-05-15T18:02:05.547 回答
1

你点击绑定是什么样的?如果要动态添加元素,则应使用委托事件。

例如:

$('#mybutton').on('click', function() { ... });

如果您使用 .html() 创建了#mybutton,将无法正常工作。相反,使用:

$('#static_container').on('click', '#mybutton', function() { ... });
于 2013-05-15T17:57:50.310 回答
0

处理程序需要为新元素重新初始化。使用jQuery .on()引用已弃用的jQuery .live()方法,该方法将为当前匹配您的选择器的元素和所有未来匹配选择器的元素设置事件处理程序。或者,您可以简单地重新启动您的 ahndler,但您目前正在这样做。

于 2013-05-15T17:57:07.940 回答
0

您需要使用 jQuery 的“on”功能来绑定点击。 http://api.jquery.com/on/

例如 $("div.innerHTML").on("click",function(){})

“on”检查事件发生时页面上是否存在特定元素。

于 2013-05-15T17:57:37.700 回答
0

因为您必须调用 click() 代码才能将其注册到新项目中,所以它不会神奇地拾取它们。

更好的解决方案是使用on()

$("#wrapperId").on("click, ".childButton", function() { alert("foo"); } );
于 2013-05-15T17:57:43.827 回答