Question

我正在创建一个WordPress主题并使用AJAX加载新的存档页面。问题是在新获取的内容中没有返回整个< script type="text/javascript">//something//< /script>。

假设我最初有这些代码：

<div id="post-1">
    <script type="text/javascript">
    //some codes here//
    </script>

    <div class="content">
    </div>
</div>

导航到下一页并使用AJAX返回原始页面后，我将获得这些（在Firebug中）：

<div id="post-1">
    <div class="content">
    </div>
</div>

不会返回整个Javascript代码块，但是在Firebug的“脚本”选项卡中的“内联”脚本下，它们仍然存在。

所以，我想知道在使用AJAX检索新内容时我做错了什么？以下是我正在使用的代码：

    jQuery('.ajax-pagination a').live('click', function(e){ //check when pagination link is clicked and stop its action.
    e.preventDefault();
    var link = jQuery(this).attr('href'); //Get the href attribute
    jQuery.ajax({
        url: link,
        dataType: "text",
        context: document.body,
        beforeSend: function(){jQuery('#container').fadeOut(500)},
        success: function(html) {
            var newhtml = $('#container', $(html))
            $('#container').html(newhtml);
            $("container").find("script").each(function(i) {
                eval($(this).text());
            });
            jQuery('#container').fadeIn(500);

        },
        error: function() {
            alert('Error');
        }
    });
    });

我正在尝试运行通过AJAX加载的Javacript，但问题似乎是Javascript本身甚至没有与其他内容一起返回。

感谢您阅读这么长的问题，我非常感谢您的帮助！

Answer 1

.html()方法从插入的HTML中删除<script>个标记。

您需要在之前遍历HTML ，然后尝试将其插入以查找所有脚本标记，然后使用jQuery.globalEval执行其内容。

success: function(html) {
    var newhtml = $('#container', $(html));

    // execute included script tags - assumes inline for now
    $('script', newhtml).each(function() {
        $.globalEval($(this).text());
    });

    $('#container').html(newhtml).fadeIn(500);
}