javascript - 通过 AJAX 加载 javascript 元素

Question

我有一个小问题，即使尝试了一个小时后我也无法解决它。我正在使用 JW Player 播放歌曲，它运行良好。播放器下方是歌曲列表，单击列表中的歌曲后，我会使用 AJAX 重新加载包含播放器的 div，并更改该 div 下面的 javascript 以播放新歌曲。 div 加载正确，但播放器在 AJAX 调用后根本不加载。没有错误只是播放器无法第二次实例化。

这是显示播放器的代码:

<div id="myDiv"><div id="myElement2">Loading the player...</div>

<script type="text/javascript">
    jwplayer("myElement2").setup({
    file: "uploads/maid.mp3",
        title: "Sintel Movie Trailer",

      width: '100%',
      skin: "six/six3.xml",
      height:30

    });
</script></div>

这是加载新歌曲时发生的情况:

document.getElementById("myDiv").innerHTML='';
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

这是来自单独的 php 文件的响应文本:

<div id="myElement2">Loading the player...</div>
<script type="text/javascript">
    jwplayer("myElement2").setup({
    file: "newfilename.mp3",
        title: "file name",

      width: '100%',
      skin: "six/six3.xml",
      height:30

    });
</script>

但在 AJAX 调用播放器消失后，只有加载播放器的文本...出现。这是播放器所在的网址: contestlancer.com/davidicus

Answer 1

我的坏处经过一些研究后我发现，即使脚本是通过 JS 调用附加的，它也没有执行，所以你必须执行它。所以任何有同样问题的人请注意，通过 AJAX 加载的脚本必须通过 javascript 中的 eval 函数执行。

所以在我的内容 AJAX 文件中，我将 id 测试给了脚本:

<script type="text/javascript" id="testing">

然后在 JS 函数中我这样做了:

if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML='';
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    eval(document.getElementById('testing').innerHTML);
    }
  }

希望它可以节省其他人的时间。问候艾哈迈尔