Question

如果我有一个执行代码的按钮

$('#main').load('welcome.html');

并且在welcome.html我有一个执行代码的按钮

$('#main').load('otherpage.html');

Javascript没有被执行，无论该功能是否在父文件的HTML代码或子代上。

如何从外部加载的HTML文件中获取Javascript函数？

修改这里有一些样本...

主页：

<body>
    <div id="main"></div>
</body>

<script>
    document.onLoad(){
        $('#main').load('welcome.html');
    }

    function show(file){
        $('#main').load(file+'.html');
    }
</script>

welcome.html页面：

<a href="javascript:show(test)">Test</a>

...但是，单击“测试”按钮时，test.html未加载到主div中。

编辑2

以下是当前状态以及问题所在 - 确切地说。

I've uploaded the bones of the code to PasteBin

当＆＃39;网格＆＃39;单击按钮，内容更改，页脚更改。

但是，具有基于Javascript的URL的页脚会出现错误：

Uncaught SyntaxError: Unexpected token ILLEGAL

...尝试访问1i.html页时。

Answer 1

变量test和字符串'test'之间存在差异：

<a href="javascript:show(test)">Test</a>

可能应该是：

<a href="javascript:void show('test')">Test</a>

Answer 2

重要的是要了解当通过AJAX将脚本加载到页面时，主页已经通过document.ready。因此，您加载的任何代码都会立即触发。

如果你加载的代码在它引用的html之前，它将在它触发时找不到那个html。

将代码放在远程页面中的html之后将解决此问题

Answer 3

检查jQuery.live()和jQuery.on()。

也许你的事件处理程序是错误的。通过load（）或ajax（）导入新标记时，必须从新文档初始化处理程序。最简单的方法是使用jQuery.on或jQuery.live（）而不是jQuery.click（）。

$('MYBUTTON').live('click', function(){
    $('#main').load('your_url.html')
})

或使用回调函数来（重新）初始化按钮事件。

更好的解决方案是：只需将target_url添加到按钮rel属性...

<button rel="YOUR_URL.html">Open Page</button>

$('button[rel]').live('click', function(){
    $('#main').load($(this).attr('rel'));
})

如何从外部HTML执行Javascript

3 个答案: