Question

我正在使用jQuery来应用一些UI效果，比如在我使用的JS文件中添加一个类到多个元素：

$('.dataGrid').each(function(){
$(this).find('tr:odd').css('background-color', '#F7F8FA');
});

但是当我使用ajax加载具有类.dataGrid的元素时，那里的规则不适用，我的解决方案是使一个函数加入像这样的所有情况并在每次调用时调用它ajax请求！ ..这个过程不是专业人员..我发现.live()，我使用过，它适用于以下事件： $('dataGrid').live('moveover', function(){ ... });。

.live解决方案非常适合事件...有没有办法使用相同的概念与那里提到的效果？ ...我的意思是一种重新应用之前规则的方法，每次对这些元素进行更改时（例如添加新元素）

我希望我很清楚，在此先感谢：）

Answer 1

Livequery - 插件支持在将新节点添加到DOM时触发功能。这样的事情应该有效：

$('.dataGrid').livequery(function() {
    $(this).find('tr:odd').css('background-color', '#F7F8FA');
}

Answer 2

根据您加载元素的方式，即您正在使用的AJAX技术，您可以通过多种方式实现此目的。如果您正在使用jQuery Ajax，那么您可以使用jQuery.when方法。

基本上使用此方法可以延迟执行。您可以说“当ajax调用完成时然后执行此功能”。语法类似于

$.when( $.ajax("test.aspx") ).then(function(ajaxArgs){ 
     alert(ajaxArgs[1]); /* ajaxArgs is [ "success", statusText, jqXHR ] */
});

以下链接将为您提供更多信息

http://api.jquery.com/jQuery.when/

Answer 3

由于您使用ajax附加.dataGrid元素，因此您可以为ajaxComplete()注册处理:odd类应用的处理程序。

$(document).ajaxComplete(function() {
  $('.dataGrid').each(function(){
    $(this).find('tr:odd').css('background-color', '#F7F8FA');
  });
});

对DOM进行任何修改的实时更改

3 个答案: