Question

我正在使用jQuery AJAX调用向我的页面添加一些代码。此代码是html和javascript的混合。但我希望只有在html部分准备就绪时才能执行javascript。但是当渲染附加的html时会引发什么事件？

以下是一个例子：

<table id="sampleTable">
   ...
</table>

<script>
  // this code should be executed only when sampleTable is rendered
  $('#sampleTable').hide();
</script>

Answer 1

使用jQuery ready（）事件：

$(document).ready(function() {
    $('#sampleTable').hide();
}

<edit>似乎无法在除Document之外的任何其他对象上调用ready事件，我的错误</edit>

如果您在谈论成功的Ajax请求后触发的事件，这是一个选项：

$('#sampleTable').ajaxComplete(function() {
    $(this).hide();
});

或者只是硬编码表格的样式来显示：none; ...

Answer 2

将您的javascript包装在“准备好”的处理程序中。这将在DOM更新后触发，毫无疑问是您想要做的。

 $(function() {
     $('#sampleTable').hide();
 });

Answer 3

$(document).ready(function() {
    $('#sampleTable').hide();    
});

http://api.jquery.com/ready/

Answer 4

您是否同时将<table>和<script>同时加载到文档中？不要

使用<script> / html()将带有load()元素的HTML插入页面非常不可靠。该脚本不直接从innerHTML包含;不同的浏览器对这些插入的脚本元素的处jQuery尝试修复其中的一些但是并没有完全正确（可能无法将其完全正确）。

最好将静态代码保存在静态脚本中，以便调用者知道在AJAX调用完成并插入内容之后必须在表上调用hide()。如果您真的要传回动态代码来运行，请将其与HTML分开，例如。通过返回包含HTML和代码成员的JSON对象。

Html是渲染事件

4 个答案: