【问题标题】:AJAX can't load JavaScript in another pageAJAX 无法在另一个页面中加载 JavaScript
【发布时间】:2017-09-01 17:47:46
【问题描述】:

为什么 AJAX 不能用 JavaScript 加载另一个 HTML 页面?它加载 HTML、CSS、PHP 等……但不加载 JavaScript。 AJAX 应该这样工作吗?如果是这样,我如何加载另一个包含带有 AJAX 的 JS 的 HTML 页面?

一个简单的例子我的意思

a.php

<!DOCTYPE html>
<html>
<body>

<div id="demo">
<h1>The XMLHttpRequest Object</h1>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML =
      this.responseText;
    }
  };
  xhttp.open("GET", "b.php", true);
  xhttp.send();
}
</script>

</body>
</html>

b.php

<!DOCTYPE html>
<html>
<body>
<h1>b</h1>
<script>
document.write("Hello World!");
</script>

</body>
</html>

回复截图:

【问题讨论】:

标签: javascript ajax


【解决方案1】:

因为您将通过 ajax 获得的 javascript 代码是一个简单的字符串并且不会被执行。您必须 eval() 脚本标记中的代码,例如:

例子:

<script id="helloworld">
document.write("Hello World!");
</script>

JS:

var jsCode = document.getElementById('helloworld').textContent;
eval(jsCode);

按要求编辑:

if (this.readyState == 4 && this.status == 200) {
    var demoElement = document.getElementById("demo");
    demoElement.innerHTML = this.responseText;
    var scriptTags = demoElement.getElementsByTagName('script');

    for(i = 0; i < scriptTags.length; i++) {
        eval(scriptTag[i].textContent);
    }
}

【讨论】:

  • 那么在我的两个示例中,我将您的代码部分都放在 a.php 或 b.php 中会怎样?
  • 那么如何将您的示例集成到我的示例中?
猜你喜欢
  • 2014-04-25
  • 2012-11-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-06-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多