Question

我想在主体加载后运行一些JS。我的框架从两个不同的静态文件中加载页眉/页脚，而正文是动态的。因此在线阅读我可以将$（elem）.load（function（））放在body的末尾，当页面加载时它会运行函数吗？我简单地尝试了一下，但似乎没有用。

{%include file='/var/www/include/tpl/header.tpl'%}
<div id="contentMain">
        <h1>{%$heading%}</h1>
        {%if isset($Details)%}
                <h4>Details</h4>
                {%$Details%}
        {%/if%}
        {%$table%}
</div>
<div id="space">
&nbsp;
</div>
<script>
        $("#contentMain").load(function(){
                alert("It worked!");
                //run some stuff here
        });
</script>
{%include file='/var/www/include/tpl/footer.tpl'%}

非常感谢任何有关如何使其发挥作用的帮助！

Answer 1

jQuery有一个方便的小功能，您可以附加到文档以在主体加载后运行功能。它是ready函数。

$(document).ready(function() {
    //Place code here to do stuff
});

这样做，您可以确保在函数内部的任何内容运行之前已加载正文及其所有内容。

Answer 2

在您的情况下，由于脚本的位置，您无需等待。脚本不会被解析/执行，直到解析它上面的元素。因此，可以安全地假设contentMain div和它的后代已经准备好被操纵了。

{%include file='/var/www/include/tpl/header.tpl'%}
<div id="contentMain">
        <h1>{%$heading%}</h1>
        {%if isset($Details)%}
                <h4>Details</h4>
                {%$Details%}
        {%/if%}
        {%$table%}
</div>
<div id="space">
&nbsp;
</div>
<script>
    alert("It worked!");
    //run some stuff here
</script>
{%include file='/var/www/include/tpl/footer.tpl'%}

Answer 3

您可以使用jquery document.ready。

执行此操作

在标题上，包括jquery引用。

<script type="text/javascript">
  $(document).ready(function() {
     alert("It worked!");
  });
</script>
</head>

一旦正文加载就运行jQuery

3 个答案: