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

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

load第二次调用时覆盖内容returns。你不能使用例如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 );
        });
    }
});

Answer 2

这里有一个笨拙但可行的解决方案：

        $(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);
                });
            });
        });

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

Using Jquery load to bring content in from 2 HTML pages

html

jquery

load