如何使用jQuery的load（fn）方法使其实际工作_Jquery

如何使用jQuery的load（fn）方法使其实际工作

jquery

如何使用jQuery的load（fn）方法使其实际工作,jquery,Jquery,JQuery文档中有这样一句话。loadfn: 注意：仅当您设置它在元素完全释放之前进行加载，如果你在那之后设置的话什么也不会发生那么什么时候应该为绑定加载事件呢？据我所知，在这个div实际出现之前执行它是不起作用的，因为$'test'不会选择它，而在那之后执行它，如上所述，已经太晚了。以下代码似乎支持这一点： <html> <head></head> <body> <script type="text/javascript" sr

JQuery文档中有这样一句话。loadfn:

注意：仅当您设置它在元素完全释放之前进行加载，如果你在那之后设置的话什么也不会发生

那么什么时候应该为绑定加载事件呢？据我所知，在这个div实际出现之前执行它是不起作用的，因为$'test'不会选择它，而在那之后执行它，如上所述，已经太晚了。以下代码似乎支持这一点：

<html>
<head></head>
<body>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">

   $('#test').load(function(event) { event.target.css('color', 'blue'); alert('a');});

</script>

<div id="test">TEST</div>

<script type="text/javascript"> 
   $('#test').load(function(event) { event.target.css('color', 'red'); alert('b');});
</script>


</body>
</html>

加载后，什么也没有发生，没有颜色变化，没有警报，Firebug说一切正常。

它可能在DOM准备就绪之前启动，因此测试div还不存在，请尝试将其包装在$document中。就绪

应该看起来像：

$(document).ready(function(){
    $('#test').load(function(event) { event.target.css('color', 'blue'); alert('a');});
};)

它可能在DOM准备就绪之前触发，因此测试div还不存在，请尝试将其包装在$document中。就绪

应该看起来像：

$(document).ready(function(){
    $('#test').load(function(event) { event.target.css('color', 'blue'); alert('a');});
};)

据我所见，只有窗口和图像触发加载事件

$(function(){
  $("#test").css("color","blue");
});

据我所见，只有窗口和图像触发加载事件

$(function(){
  $("#test").css("color","blue");
});

加载事件用于异步加载的元素，如图像和ajax加载的内容

它对于静态内容是无用的

在您的示例中，第一个加载事件处理程序是在定义测试元素之前绑定的，因此它无法工作。第二个加载事件处理程序太晚了，因为测试已经加载。

加载事件用于异步加载的元素，如图像和ajax加载的内容

它对于静态内容是无用的

在您的示例中，第一个加载事件处理程序是在定义测试元素之前绑定的，因此它无法工作。第二个加载事件处理程序太晚了，因为测试已经加载。

如果我正确理解您的意图，您打算编写的代码是：

$(function() {
  $('#test').css('color', 'blue');
  alert('a');
});

如果您还希望测试元素在通过AJAX调用加载其内容时执行特定功能，请尝试以下操作：

$(function() {
  $('#test').css('color', 'blue').load(function() {
    $('#test').css('color', 'red');
    alert('b');
  });
  alert('a');
});

如果我正确理解了您的意图，那么您打算编写的代码是：

$(function() {
  $('#test').css('color', 'blue');
  alert('a');
});

如果您还希望测试元素在通过AJAX调用加载其内容时执行特定功能，请尝试以下操作：

$(function() {
  $('#test').css('color', 'blue').load(function() {
    $('#test').css('color', 'red');
    alert('b');
  });
  alert('a');
});

对。如果您需要在加载时修改某些内容，请在$document.ready中通过它…那么有没有其他方法可以强制同时显示静态dom元素及其动态创建的内容？我试图避免这样的情况：在重新加载页面后，用户看到静态dom元素中没有任何内容，并且在该元素被javascript函数的结果填充之前，必须花费大约一秒的时间。当然，我可以在服务器端创建这些初始内容，但我希望这完全可以在js.right-o中完成。如果您需要在加载时修改某些内容，请在$document.ready中通过它…那么有没有其他方法可以强制同时显示静态dom元素及其动态创建的内容？我试图避免这样的情况：在重新加载页面后，用户看到静态dom元素中没有任何内容，并且在该元素被javascript函数的结果填充之前，必须花费大约一秒的时间。当然，我可以在服务器端创建这个初始内容，但我希望这可以完全用js来完成。在这种情况下，从我所知，load方法是不必要的。在这种情况下，从我所知，load方法是不必要的。事实上，我试图做一些不同的事情，并且以我现在觉得奇怪的方式。更不用说它不起作用了我在Philippe Leybaert的回答下解释了。@Olek感谢您的澄清。我理解内容加载延迟的问题。您几乎肯定已经想到了这一点，但也许一个加载对话框或指示器就足够了？事实上，我正在尝试做一些不同的事情，并且以现在对我来说似乎很奇怪的方式。更不用说它不起作用了我在Philippe Leybaert的回答下解释了。@Olek感谢您的澄清。我理解内容加载延迟的问题。您几乎肯定已经想到了这一点，但也许一个加载对话框或指示器就足够了？