0

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

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

所以这里的想法是 AJAX 根据 URL( #query) 的片段值将适当地填充<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 中运行。

有任何想法吗？

4

1 回答 1

0

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

在 AJAX 检索的 <div> 中执行 <script>

于 2013-04-19T10:31:57.633 回答