让 jquery 以 json 呈现的 html 格式工作的问题答案

【问题标题】：Problems to get jquery to work in json rendered html format让 jquery 以 json 呈现的 html 格式工作的问题
【发布时间】：2026-01-14 03:25:01
【问题描述】：

我运行 FB bigPipe 的“剥离”版本，它运行完美，除了 jquery。当我以 json 格式解析 jquery 并附加到 div 标签时，jquery 停止工作。

你可以看到我使用的“bigPipe”jquery代码here

实现此功能的代码非常简单。在 PHP 中：

$data = array(
        'id' =>  {div tag ID},
        'content' => {html content},
        'title' => {document title},
        'css' =>  {...},
        'js' => {...}
        );

$output = '<script>Test.render(' . json_encode($data) . ');</script>';

我认为问题在于我必须将 window.addEventListener 添加到窗口本身，而不是添加到 div 标记中，然后添加内容。

我在这里卡住了。我该怎么做呢？如何让这个 jquery 在这个附加的 html 中工作？

这是一个关于它应该如何工作的示例：

如果您尝试从 php 文件运行此代码，则会出现问题。请执行以下操作：

将来自 jsFiddle 的 js 代码放入一个 js 文件中，并正常包含在 .php 文件中。在 php 文件中创建一个 div 标签并将其命名为“not_working”- 保存
创建一个空的 .html 文档并添加一个 div 标签，如<div id="test">Click me</div> 并保存。
1. 创建一个新的 js 文件并将其命名为 test.js。输入这段代码：

$(函数() {

$("body").on("click","#test",function(){
    alert("You clicked me!!");
});

});

保存。

在 PHP 文件中，添加：$data = array( 'id' => "not_working", 'content' => {LINK and NAME to the HTML file you created!!}, 'title' => "Test", 'css' => "", 'js' => {LINK and NAME to the JS file you created!!}, );
运行 .php 文件，单击 Click me!。

【问题讨论】：

jquery?我在 jsfiddle 代码中没有看到任何 jquery？你是说Javascript吗？
你有一些 javascript 错误吗？结果是什么？你能提供更多的背景信息吗？
@winner_joiner 我用一个关于这应该如何工作的教程更新了我的问题。试试看，告诉我为什么不工作:)
+1 用于使用额外信息（甚至 jsFiddle）更新问题并发布自己找到的解决方案。

标签： php javascript jquery html json

【解决方案1】：

问题解决了。这是将js文件插入body元素的方式错误。修复该代码后。我解决了它，现在一切正常。

如果有人尝试使用此代码，以下是更改：

function _addJsFile(filename) {
  var blody = document.getElementsByTagName("body")[0],
  script = document.createElement('script'),
  done = false;

  script.src = filename;
  script.type='text/javascript';
  script.onload = function() {
      if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState === "complete")) {
        done = true;
        // Handle memory leak in IE
        script.onload = script.onreadystatechange = null;
        if (blody && script.parentNode) {
          blody.removeChild(script);
        }
     }
  };

  blody.appendChild(script);
}

【讨论】：