加载另一个php文件时jquery函数冲突并返回错误

Question

我有以下工作示例应用程序，它在终端窗口中显示键入文本：

第 1 步 - 没有问题的工作示例（一个文件夹中有 3 个文件：index.php,style.css和typed-custom.js）

我有以下内容style.css：

 .terminal-window {

  text-align: left;

  width: 620px;

  height: 650px;

  border-radius: 10px;

  margin: auto;

  position: relative;

}

.terminal-window section.terminal {

  color: white;

  font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";

  font-size: 11pt;

  background: black;

  padding: 10px;

  box-sizing: border-box;

  position: absolute;

  width: 100%;

  top: 30px;

  bottom: 0;

  overflow: auto;

}

.term-home{color: #0095ff;}

我有以下内容typed-custom.js

$(function() {

  var data = [

  {

    action: 'type',

    strings: ["typing-1:"],

    output: '<span class="green"><small> This is first typing</small></span>&nbsp;',

    postDelay: 1000,

  },

  {

    action: 'type',

    strings: ["typing-2:"],

    output: '<span class="green"><small>This is second typing</small></span>&nbsp;',

    postDelay: 1000

  },

  ];

  runScripts(data, 0);

});

function runScripts(data, pos) {

    var prompt = $('.prompt'),

        script = data[pos];

    if(script.clear === true) {

      $('.history').html('');

    }

    switch(script.action) {

        case 'type':

          // cleanup for next execution

          prompt.removeData();

          $('.typed-cursor').text('');

          prompt.typed({

            strings: script.strings,

            typeSpeed: 10,

            callback: function() {

              var history = $('.history').html();

              history = history ? [history] : [];

              history.push('<span class="term-home">root:~$</span> ' + prompt.text());

              if(script.output) {

                history.push(script.output);

                prompt.html('');

                $('.history').html(history.join('<br>'));

              }

Answer 1

如果 load.php 打算插入到 index.php 中，那么它不应该有自己的 html、head 和 body 标签。它应该只是将要注入主页的 HTML 片段。在另一个 HTML 文档中加载一个全新的独立 HTML 文档（由 html/head/body 标记表示）没有任何意义。另外...您只是在 index.php 完成加载后立即将“load.php”添加到页面。相反，您可以通过 PHP 的命令包含它include- 这样它就可以与 index.php 同时发送到浏览器，而无需单独获取。这样会更有效率并且更不容易出错。并且 load.php 不需要添加 jQuery 的另一个副本，因此您可以删除它 - 它可能会导致冲突或意外行为。浏览器将这两个文件视为单个页面的一部分，因此它只需要一个 jQuery 副本。