jquery - jQuery 加载到 div 然后所有链接都应该在那个 div + 切换功能中打开

Question

我是 jQuery 和 stackoverflow 的新手。

我已经尝试解决这个问题两天了，谷歌搜索并无法真正弄清楚 - 所以是时候伸出手来了。

• 我有一个主要内容的 .main div
• 我有一个菜单的#sidebar。

• 在那个菜单上，我有一个关于#thumbslink 的链接

  1. 当我点击#thumbslink
     • 我想将外部 div 从“/project-single.html #project-single”加载到#siteloader
     • 用 .main 替换 #siteloader
  2. 当我再次单击#thumbslink 时，我希望它反转

（1和2工作正常）

问题（什么现在不能一起工作）

• 我想在同一个 div 中打开 #siteloader 中可见的所有链接
• 同时使用#thumbslink 作为切换器（如#2）。

无论如何，这是我的代码：

HTML（粗略）：

<div id="thumbslink">
<a href="#">THUMBS</a>
</div>

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

<div id="siteloader"></div>

jQuery：

// LOAD #Project-single onClick #thumbslink in #siteloader

$(function() {
    $("#thumbslink").click(function() {
        $('#siteloader')
           .load('http://jacoberiksson/project-single.html #project-single');

    });

// LOAD all clicked links (a) in #siteloader

$("#siteloader").on("click", "a", function (e) {
    $("#siteloader").load($(this).attr("href"));
    e.preventDefault();
});

});

// TOGGLE #siteloader & .main onClick #thumbslink

$(function(){
    $("#thumbslink").on("click", function(){
        $("#siteloader").toggle('fade');
        $(".main").toggle('fade');

    });
});

谢谢！

Answer 1

<div>
<a href="#" id="thumbslink">THUMBS</a>
</div>

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

<div id="siteloader">
    <a href="">If your external site is not in the same domain as your site then No. I would suggest you to use JSONP objects to send/receive between sites in different domain.
    </a><br/>
    <a href="">If it the same  then use ajax request
    </a>
</div>

jQuery

$("#siteloader").hide();

$("#thumbslink").click(function() {
        $('#siteloader').find('a').each(function() {
        $('#siteloader').append($(this).attr('href'));
    });
});


$(function(){
    $("#thumbslink").on("click", function(){
        if($('#siteloader').is(":visible")){
            $("#siteloader").hide('');
            $(".main").show('');
        }
        else{
            $(".main").hide('');
            $("#siteloader").show('');
        }
    });
});

提琴手