Question

在我的网站上我有一个简单的导航栏，点击不同的项目会导致主要内容发生变化。从技术上讲，所有操作都在一个文件“main.html”中完成，其中包含所有内容，我使用jquery函数“load”来动态加载其他html文件，将其放在main.html中。只要在我嵌入的这些html文件中没有javascript，这就可以正常工作。但是有一个我想要嵌入的文件，里面还有javascript代码，应该在$（document）.ready上执行。但这永远不会发生 - 在javascript中没有错误，它永远不会被执行。我想这是因为我只更改了“main.html”的DOM，然后就没有“onReady”事件被触发了。有人能告诉我什么是获得理想行为的最佳方法吗？将javascript放在“main.html”中会导致一切正常，但对我来说这不是一个选择。

提前致谢！

更新：问题已解决 问题解决了。当我在onReady（）事件之外调用javascript时（正如Loic Coenen所建议的那样），它的工作原理与之相同。我还删除了缠绕的标签。非常感谢所有帮助过我的人！

Answer 1

你在main.html，其中包含一个头部，身体。问题可能是当你加载页面时你的其他页面也有一个头部和正文等等，如果你加载到一个div，它应该只是代码，可以是javascript，但没有头或身体。但如果你反对，这是你的解决方案

$("#loadnewpagebttn").load(location.href+" foobar ",function(){
    $.getScript("js/yourscript.js"); 
});

您需要为该页面创建一个脚本文件并加载它。内联脚本无论如何都是一个坏习惯

完整示例：

jQuery.getScript( url, [ success(data, textStatus) ] )
url - A string containing the URL to which the request is sent.

success(data, textStatus) - A callback function that is executed if the request succeeds.

$.getScript('ajax/test.js', function() {
  alert('Load was performed.');
});

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

Answer 2

您可以触发自定义事件以通知您的other.html脚本已加载树。我没有尝试过，但我会使用类似的东西：

在main.html中：

$('#div_to_load').load('other.html',{},function(){
    $('#div_to_load').trigger('loaded')
})

在other.html

中

$('#div_to_load').on('loaded', function(){
     // Code to execute  
})

我不知道这是否可以解决问题。

编辑：我认为您的other.html中直接包含的javascript仍会执行。

如何动态包含一个包含javascript的html文件

2 个答案: