Question

我有一个AJAX深层链接网站。基本结构是这样的：

<html>
    <head>
        ...
    </head>
    <body>
        ...
        <!-- AJAX will change the content of this div tag -->
        <div id="ajax">
            ...
        </div>
        ...
    </body>
</html>

所以这里的想法是，根据URL（#query）的片段值，AJAX将适当地填充<div id="ajax">的内容。

这是问题所在。考虑一下。用户最初加载此页面 - （#home）和以下加载：

<html>
    <head>
        ...
    </head>
    <body>
        ...
        <!-- AJAX will change the content of this div tag -->
        <div id="ajax">
            <!-- content of the home page -->
            ...
        </div>
        ...
    </body>
</html>

此后，用户转到页面#query。为了加载此页面，AJAX将更改<div id="ajax">标记的innerHTML。假设#query的内容具有嵌入对象（在此示例中为使用FlowPlayer的嵌入视频）。在完成AJAX之后，代码将看起来像这样。

<html>
    <head>
        ...
    </head>
    <body>
        ...
        <!-- AJAX will change the content of this div tag -->
        <div id="ajax">
            <!-- Flowplayer JavaScript component -->
            <script src="flowplayer-3.2.4.min.js"></script>
            <!-- The player container -->
            <div id="player" style="width:720px;height:480px;"></div>
            <!-- Player installation -->
            <script>
                flowplayer("player", "flowplayer.swf", {
                    clip: "video.mp4"
                });
            </script>
        </div>
        ...
    </body>
</html>

所以这就是问题，当我尝试这样做时，以下脚本永远不会运行，因此视频永远不会加载：

<script>
    flowplayer("player", "flowplayer.swf", {
        clip: "video.mp4"
    });
</script>

如何解决此问题或我做错了什么？

感谢任何帮助。

编辑进度报告

我曾经通过这样做来交换ajax div标签的HTML内容：

document.getElementById("ajax").innerHTML = xmlhttprequest.responseText;

现在我已将其更改为：

var element = document.createElement("div");
element.setAttribute("id", "ajax");
element.innerHTML = xmlhttprequest.responseText;
toswap = document.getElementById("ajax");
toswap.parentNode.replaceChild(element, toswap);

这解决了Firefox中的问题，因此<script>被触发，但它仍无法在Chrome和IE中使用。

有什么想法吗？

Answer 1

浏览器不会执行已作为文本添加到DOM的JavaScript。看看这个问题：

Executing <script> inside <div> retrieved by AJAX

如何在AJAX深层链接站点中运行嵌入对象的脚本

1 个答案: