Question

我正在尝试将多个页面中的一些内容加载到一个页面中。我知道这些火有序，所以只有pageB2的内容会加载，因为它是最后一次。当用户点击#nav_b时，有没有办法让pageB和pageB2的内容出现在新页面中？

$(function(){
            $("#nav_b").on("click", function(){
                $("#main_text").load("pageB.html h2,h3,span,#hidden");  
            });
            $("#nav_b").on("click", function(){
                $("#main_text").load("pageB2.html h2,h3,span,#hidden");  
            });
        });

Answer 1

这是一个黑客但有效的解决方案：

        $(function() {
            $("#nav_b").on("click", function(){
                var pageB = '', pageB2 = '';
                var $mainText = $("#main_text");
                $mainText.load("pageB.html h2,h3,span,#hidden", function() {
                    pageB = $mainText.html();
                    $mainText.html(pageB + pageB2);
                });
                $mainText.load("pageB2.html h2,h3,span,#hidden", function() {
                    pageB2 = $mainText.html();
                    $mainText.html(pageB + pageB2);
                });
            });
        });

Answer 2

第二次调用返回时，

load会覆盖内容。无法使用，例如jQuery.get()？

示例（未经测试）。这里数据被附加到目标元素。

$(function(){
    $("#nav_b").on("click", function(){
        $.get( "pageB.html h2,h3,span,#hidden", function( data ) {
              $("#main_text").append( data );
        });
        $.get( "pageB2.html h2,h3,span,#hidden", function( data ) {
              $("#main_text").append( data );
        });
    }
});

使用Jquery加载从2个HTML页面引入内容

2 个答案: