jQuery链接操作

这个问题对于我试图使用的代码来说是非常具体的，首先我承认我不知道如何用jQuery编写，我会更多地攻击/操作现有的脚本，但我会在某个阶段学习，但我需要解决当前的问题

基本上，我有一个简单的选项卡布局，可以交换内容，我的问题是我交换的内容是从CMS生成的，所以屏幕内的链接会将你带到不同的页面。我想做的是通过操纵a href或可能是我只能通过iframe实现的东西来保持内容在screen div内，但如果可能的话，我想远离它。对不起，如果我的解释不清楚下面的代码

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <style>
    .content {display:none;}
    .tab {cursor:pointer; width:20%; float:left; text-align:center; color:#fff; padding:10px;}
    #screen {clear:both; padding:20px 0 0 0;}
    </style>
    <script>
    $(document).ready(function(){
    var $content1 = $('.content').first().clone();
    $content1.css("display", "block");
    $('div#screen').html($content1);
    $(".tab").live("click", function() {
    var $content = $(this).next('div.content').clone();
    $content.css("display", "block");
    $('div#screen').html($content);}
    );
    });
    </script>
    <div class="tab">
    Tab Title
    </div>
    <div class="content">
    <a href="toplevelpage/pageexample.html">Link</a><br />
    <a href="toplevelpage/pageexample2.html">Link2</a><br />
    <a href="toplevelpage/pageexample3.html">Link3</a>
    </div>
<div class="tab">
    Tab Title2
    </div>
    <div class="content">
    <a href="toplevelpage/pageexample.html">Link</a><br />
    <a href="toplevelpage/pageexample2.html">Link2</a><br />
    <a href="toplevelpage/pageexample3.html">Link3</a>
    </div>
<div id="screen">
</div>

---

要将内容加载到div中，可以使用load-：

---

不过，您可能希望选择带有类的链接，因为否则页面上的每个链接都将加载到内容中。

您要做的是在单击链接时将内容从cms加载到div中，对吗？

$('a').on('click',function(e){
    e.preventDefault();
    $('div.content').load($(this).attr('href'));
});