Javascript 如何从ajax加载的html文件加载jscript？_Javascript_Jquery_Html_Ajax_Jquery Ui

Javascript 如何从ajax加载的html文件加载jscript？

javascript jquery html ajax jquery-ui

Javascript 如何从ajax加载的html文件加载jscript？,javascript,jquery,html,ajax,jquery-ui,Javascript,Jquery,Html,Ajax,Jquery Ui,我有一个带有空div的html文件（index.html），它使用ajax从另一个html文件（second.html）加载内容我正在使用加载一个弹出窗口，其中包含一个用于在index.html上单击按钮的音频播放器当我在index.html上进行了如下所有编码时，它工作正常，并在单击按钮时在弹出窗口中显示音频播放器。- 当我像上面的例子那样使用它时，音频播放器只会显示在索引页上。该按钮显示在播放器下方，不起任何作用我已经尝试了很多方法来尝试用ajax加载JS，但到目前为止没有任何效果。由

我有一个带有空div的html文件（index.html），它使用ajax从另一个html文件（second.html）加载内容

我正在使用加载一个弹出窗口，其中包含一个用于在index.html上单击按钮的音频播放器

当我在index.html上进行了如下所有编码时，它工作正常，并在单击按钮时在弹出窗口中显示音频播放器。-

当我像上面的例子那样使用它时，音频播放器只会显示在索引页上。该按钮显示在播放器下方，不起任何作用

我已经尝试了很多方法来尝试用ajax加载JS，但到目前为止没有任何效果。由于我对JS和ajax都是新手，我怀疑可能有一个简单的补丁我没有。因此，如果您能帮助它正常工作，我们将不胜感激。

我不清楚您通过AJAX加载JavaScript的意思，因为您试图加载的代码不包含任何JS。但是，至于为什么音频播放器没有按预期显示，问题的第一部分似乎是index.html中没有ID为“nonen”的div（或其他元素）。您也不需要在second.html中重复'stuff'div的定义

因此，我将删除second.html的第一行和最后一行，并将您的

onreadystatechange

函数更改为包含

document.getElementById("stuff").innerHTML=xmlhttp.responseText;

或者，由于您已经在使用jQuery，我建议您使用。此外，根据您想要的效果，我怀疑您应该在添加第二个div之后调用jqueryui对话框例程（或者在每次加载它之后，如果以后再次更改它）

例如，您当前的脚本可以替换为以下类似（未测试）的代码。首先，您要确保在AJAX调用完成后，可以稍后调用

audioPlay（）

，并且在第一次调用完成之前，它不会在页面加载时立即执行

audioPlay = function () { // Define a function to be called multiple times later
  $('#audio').dialog({
    ... // Fill in your options
  });
  $('#opener').click(function () {
    $('#audio').dialog('open');
  });
};

接下来，您希望加载的HTML插入DOM后，

loadXMLDoc（）

函数调用

audioPlay（）

loadXMLDoc = function () {
  $('#audio').dialog('destroy'); // Get rid of any existing dialog
  $.ajax({
    dataType: 'html', // Load some HTML data via AJAX
    url: 'second.html', // From this file (relative URL)
    success: function (data) { // When the HTML has finished being downloaded...
      $('#stuff').innerHTML(data); // ...add it to the div with ID "stuff"
      audioPlay(); // ...and create a dialog for the new div
    }
  });
};

好的，修好了。正如我所料，这是一个简单的解决方案。只需创建一个runPopupJs（）函数并在onload时调用它

function runPopupJs() {
 var head = document.getElementsByTagName('head')[0];
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = 'js/popup.js';
 head.appendChild(script);
}

称之为——

<body onload="loadXMLDoc();runPopupJs()">

谢谢@Michael的回复。然而，“nonen”是一个拼写错误，我已经修复了它。我遇到的问题不是音频播放器没有出现。这是因为它显示在index.html页面本身上。我希望索引页只显示按钮打开弹出窗口。当有人点击音频播放器时，它会弹出。我之所以提到通过AJAX加载JavaScript，是因为我单独加载JS文件（如上面更新的问题所示。）Hi@Michael，尽管我使用了下面的修复程序，但它只在第一页起作用。你可以在这里查看网站-。请看一看。提前谢谢！嗨@HeshanGalahitiyawa。我看了一下那页。我不确定你想要什么样的表现，你不喜欢哪一部分，你希望它做什么。然而，根据你在这里的评论，我想我对你如何至少走上正确的道路有了更好的了解。我已经更新了我的答案——如果有帮助，请告诉我。如果没有，请在你的问题中详细说明到底哪里出了“错”——什么不应该发生，什么不应该发生（或者两者都应该发生）。

audioPlay = function () { // Define a function to be called multiple times later
  $('#audio').dialog({
    ... // Fill in your options
  });
  $('#opener').click(function () {
    $('#audio').dialog('open');
  });
};

loadXMLDoc = function () {
  $('#audio').dialog('destroy'); // Get rid of any existing dialog
  $.ajax({
    dataType: 'html', // Load some HTML data via AJAX
    url: 'second.html', // From this file (relative URL)
    success: function (data) { // When the HTML has finished being downloaded...
      $('#stuff').innerHTML(data); // ...add it to the div with ID "stuff"
      audioPlay(); // ...and create a dialog for the new div
    }
  });
};

function runPopupJs() {
 var head = document.getElementsByTagName('head')[0];
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = 'js/popup.js';
 head.appendChild(script);
}

<body onload="loadXMLDoc();runPopupJs()">