如何将$(document).ready()重新应用于通过AJAX加载的部分HTML?

时间:2011-04-22 17:18:26

标签: javascript jquery ajax

我仍然是一个jQuery新手,我正在尝试将ThemeForest模板集成到我的项目中。这个ThemeForest模板(vPanel)很棒但是它集成了很多jQuery插件和功能,所以我有很多$(document).ready()到处都有,我很难搞清楚哪个脚本做了什么。我正在寻找的原因是因为所有这些脚本在初始加载时都很好地适用于页面,但是我的UI中还有一些部分稍后通过AJAX加载。这就是我的问题开始的地方:有没有办法将所有脚本重新应用到通过AJAX加载的部分HTML?

2 个答案:

答案 0 :(得分:5)

您正在寻找的是live() event。您可能需要返回并更改某些插件,以便像

这样的内容
$("my_button").click(function(){ }

成为

$("my_button").live("click", function(){ }

其中“my_button”可以稍后通过AJAX。

答案 1 :(得分:0)

如果脚本所做的只是连接事件,您可以使用delegate方法(替换live方法)将它们连接到包含元素。

如果脚本对元素进行了其他更改,则您需要使用上下文参数,以便可以将更改重新应用于页面的特定部分。例如:

function applyTemplate(context) {
  $('.someclass', context).each(function(){
    // does something with the elements
  });
}

$(function(){
  // apply to whole page:
  applyTemplate(document.body);
  // load more content, and apply to what's loaded:
  $('#somePart').load('getpart.aspx', function(){
    applyTemplate($('#somePart'));
  });
});