Question

我正在使用jQuery.ajax调用一个脚本，将结果渲染为html片段并将其加载到div中，如下所示：

jQuery.ajax({type:'POST',data:{'var': '1'}, url:'/some/script',success:function(data,textStatus){jQuery('#myDiv').html(data);}});

脚本执行并将页面加载到我的div中。我遇到的问题/困境是我的父页面（我称之为ajax的页面）在页眉中包含了一些jquery脚本，这些脚本在页面加载时运行，例如日期选择器，labelify，ui.selectmenu选择框和还有一些。但是，一旦我的子页面加载，它就不会继承这些脚本应用的样式/功能。我理解这是因为这些脚本是在父页面加载时执行的，并且在加载子页面时不会触发。问题：

子HTML页面应该是一个完整的HTML页面，它有自己的标题和正文，并包含所有需要的脚本，即使父目录中包含相同的脚本。（右边的子页面只是一个html代码段）
如果它不应该是一个完整的HTML页面，那么我是否应该在子页面的主体中包含我的所有脚本（html代码段）
是否有一种简单的方法可以在子加载时触发所有jquery父脚本。基本上伪造父母的页面加载。

还有其他想法吗？

谢谢！

Answer 1

如果您将要运行的脚本放在包含文件中的文档onload中，则在加载内容时它将与父脚本一起运行。

在其中创建一个包含此文件的新文件，并将其加载到您的父文件中以查看。不要在子文件中包含jQuery脚本，因此它无法单独访问$（document）。

<script type="text/javascript">
$(document).ready(function(){
    alert('a');
});
</script>

要使来自父级的任何run-on-load-code应用于子级，您可能必须创建一个在父级中执行所有操作的函数，并允许子级在加载时调用它。 / p>

目前的父母：

<script>
    $(document).ready(function(){ doSomething(); doSomethingElse(); });
</script>

...变为

<script>
    $(document).ready(function(){ loaded(); });
    function loaded () { doSomething(); doSomethingElse(); }
</script>

然后在孩子身上，它也会调用$(document).ready(function(){ loaded(); });。

Answer 2

如果您正在寻找事件处理程序，请尝试jQuery.live。如果你在onload上有通用的ui东西，比如

$(".datepicker").datepicker();

尝试将其包装到具有特定焦点的函数中：

function doLayout(focus)
{
$(focus).find(".datepicker").datepicker();
}

现在，只要加载了AJAX内容，就可以调用doLayout（“＃myDiv”）。对于$ .ready，请使用doLayout（“body”）。

如何使用jQuery ajax继承父javascript

2 个答案: