jQuery的绑定功能，并触发Ajax调用后， [英] jquery bind functions and triggers after ajax call

问题描述

 函数bindALLFunctions（）{
  ..all触发相关的功能去这里
};


$阿贾克斯（{
        键入：POST，
        网址：myURL，
        数据：{thisParamIdNo：thisIdNo}，
        成功：功能（数据）{
                        $（。incContainer）的HTML（数据）。
                        bindALLFunctions（）;
        }，
        数据类型：HTML
}）;
 

我是新来的AJAX和JQuery的。 我在我的JS-的jQuery code以上的AJAX调用。 bindALLFunctions（）; 用于Ajax调用后重新呼吁所有触发器和功能。它的工作原理一切优秀和良好的预期。然而，我读的地方，是更好的初始动作完成后加载的东西，所以我尝试添加/编辑下面的两个没有任何成功。 任何想法？

  1） - ＆GT; $（incContainer）HTML（数据，函数（）{
                                          bindALLFunctions（）;
                                        }）;

2） - ＆GT; $（。incContainer）的HTML（数据）.bindALLFunctions（）。
 

解决方案

也许你应该看看到href="http://api.jquery.com/live/" rel="nofollow">现场的和委托功能。

：您可以在您的应用程序和所有加载的AJAX code将自动绑定的一开始就设定一个独特的事件处理程序

  $（表）。代表（TD，悬停，函数（）{
    $（本）.toggleClass（悬停）;
}）;
 

但是，如果你preFER使用Jquery.ajax叫你需要做的是这样的：

  $。阿贾克斯（{
        键入：POST，
        网址：myURL，
        数据：{thisParamIdNo：thisIdNo}，
        成功：功能（数据）{
                        $（。incContainer）的HTML（数据）。
                        bindALLFunctions（incContainer。）;
        }，
        数据类型：HTML
}）;
 

和变换 bindALLFunctions 为：

 函数bindALLFunctions（选择）{
  ..all触发相关的功能放在这里。例：
  $（'＃富'，选择器）.bind（'点击'，函数（）{
     警报（用户点击福。）;
  }）;
};
 

这只会结合给定的选择下的事件。

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'
});

I am new to ajax and JQuery. I have the above ajax call in my js-jquery code. bindALLFunctions(); is used to re-call all the triggers and functions after the ajax call. It works all fine and good as expected. However, I have read somewhere that is better to load something after the initial action is finished, so I have tried to add/edit the following two without any success. Any ideas?

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

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

解决方案

Perhaps you should have a look to the live and delegate functions. You can set a unique event handler at the beggining of your app and all your loaded ajax code will be automatically binded:

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

But if you prefer to use Jquery.ajax call you have to do something like this:

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

and transform bindALLFunctions as:

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

that will only bind events "under" the given selector.

这篇关于jQuery的绑定功能，并触发Ajax调用后，的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！