Question

function bindALLFunctions() {
  ..all triggers functions related go here
};


$.ajax({
        type: 'POST',
        url: myURL,
        data: { thisParamIdNo: thisIdNo },
        success:    function(data){
                        $(".incContainer").html(data);
                        bindALLFunctions();
        },
        dataType: 'html'
});

我是ajax和JQuery的新手。我在js-jquery代码中有上面的ajax调用。 bindALLFunctions（）; 用于在ajax调用之后重新调用所有触发器和函数。它按预期工作得很好。但是，我已经阅读了一些在初始操作完成后加载某些内容更好的地方，所以我尝试添加/编辑以下两个而没有任何成功。有什么想法吗？

1) ->    $(".incContainer").html(data, function(){
                                          bindALLFunctions(); 
                                        });

2) ->    $(".incContainer").html(data).bindALLFunctions();

Answer 1

也许您应该查看live和delegate函数。您可以在应用程序的开头设置一个唯一的事件处理程序，所有加载的ajax代码将自动绑定：

$("table").delegate("td", "hover", function(){
    $(this).toggleClass("hover");
});

但如果您更喜欢使用Jquery.ajax调用，则必须执行以下操作：

$.ajax({
        type: 'POST',
        url: myURL,
        data: { thisParamIdNo: thisIdNo },
        success:    function(data){
                        $(".incContainer").html(data);
                        bindALLFunctions(".incContainer");
        },
        dataType: 'html'
});

并将bindALLFunctions转换为：

function bindALLFunctions(selector) {
  ..all triggers functions related go here. Example:
  $('#foo', selector).bind('click', function() {
     alert('User clicked on "foo."');
  });
};

只会绑定给定选择器下的事件。

Answer 2

您的初始代码很好。新版本不起作用，因为html()函数没有回调函数。

Answer 3

很难从你的问题中看出你打算提出什么问题，但我的猜测是你想了解ready函数。它可以让你在文件可用后调用你的bindALLFunctions;只需$(document).ready(bindALLFunctions)或$(document).ready(function() { bindALLFunctions(); })。

jQuery在ajax调用后绑定函数和触发器

3 个答案: