javascript - Ajax 加载内联 javascript

标签 javascript php jquery html ajax

有没有办法让AJAX成功加载内联脚本函数?

我似乎无法弄清楚为什么这不起作用。我正在尝试使用 AJAX 渲染页面并且页面渲染成功;但是,除非我在父文档中声明 JavaScript 函数,否则我无法使内联脚本正常工作。我生成了一个与我想要完成的任务相关的简单示例。

<小时/> 父文件

    <!DOCTYPE html>
    <html>
      <head>
        <script type='text/javascript'>
          function loadChild(){
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
              if (this.readyState == 4 && this.status == 200) {
               document.getElementById("childContent").innerHTML = this.responseText;
              }
            };
            xhttp.open("GET", "./child.html", true);
            xhttp.send();
          }
        </script>
      </head>
      <body>
        <input type='button' value='Load Child' onclick='loadChild();'/>
        <div id='childContent'>

        </div>
      </body>
    </html>

<小时/> child 文件

    <input type='button' value='Child Function' onclick='childFunction();'/>
    <script type='text/javascript'>
      function childFunction(){
        alert('Do something');
      }
    </script>

<小时/> 我正在尝试通过 PHP 创建一个自适应框架,我可以将其用于整个网站,并使用 AJAX 调用子网站来加载;但是,为了使其当前正常运行,我必须在调用每个页面之前渲染父文档中的每个函数。我想知道是否有办法让AJAX成功加载内联脚本函数?

最佳答案

在这种情况下,我使用两种技术来做到这一点,

  1. 使用jQuery使用getscript()函数加载一个新的脚本,该脚本会自动执行该脚本。

例如

$.getScript( "child.js", function( data, textStatus, jqxhr ) {
    //add this script to the document
});

这里只加载child.js,然后将其添加到文档DOM(脚本DOM)中,并执行child.js文件中编写的javascript函数。

  • 另一种方法是将整个代码添加到 DOM 中。 作为 DOM 文本插入的 JavaScript 将不会执行。但您可以使用动态脚本模式来执行新的 Javascript 代码。
  • 请引用堆栈溢出中的这个问题:Javascript Inserted inside DOM 。您需要在 child.html 代码内的 javascript 中使用 eval() 函数才能执行 DOM

    谢谢,祝你好运:)

    关于javascript - Ajax 加载内联 javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39652651/

    相关文章:

    javascript - 像 Airbnb 一样,切换从顶部出现(下推)的 div 后,将滚动条设置为零(一次)

    php - 我什么时候应该向 AJAX 返回 true/false 以及什么时候应该 echo "true"/"false"

    javascript - SailsJS 蓝图匹配错误的模型

    javascript - jQuery 变量结果为 "undefined",即使是全局的

    c# - 从 php 页面获取响应

    Php、Mysql根据前缀选择字段

    jquery - 获取子元素的事件而不触发父元素的相同事件

    javascript - 我可以修改 ReactJs 中组件的父状态吗?

    javascript - 定时器循环永远不会运行

    javascript - Ionic 项目,不在手机上工作,而是在开发过程中工作