jQuery UI选项卡在选项卡中加载特定链接

时间:2009-10-04 18:15:52

标签: javascript jquery

我想只加载选项卡内某个div内的链接,否则只能转到实际链接。

当前我使用的代码在同一个标​​签中加载内容中的所有链接

<script type="text/javascript">
      $(function(){
        $('#tabs').tabs({
          load: function(event, ui) {
            $('a', ui.panel).click(function() {
              var tabId=$('#tabs').tabs('option', 'selected');
             $('#tabs').tabs("url", tabId, this.href).tabs("load",tabId);
              return false;
            });
          }
        });
      }); 
</script>

标签页

    <div id="sresults" style="width: 520px">
    <div id="tabs">
        <ul>
            <li><a href="mylink.html">Songs</a></li>
            <li><a href="mylink.html">Albums</a></li>
            <li><a href="mylink.html">Videos</a></li>
            <li><a href="mylink.html">Entire Blog</a></li>
        </ul>
    </div>
</div> 

然后是标签页面中的页面

<div id="content">
<a href="permalink.html">My links</a>
</div>

<div id="navi"><a href="tab?page=2">Next Page</a>
</div>

我希望navi div中的链接在选项卡中加载,但外面的所有链接都应该转到实际链接

1 个答案:

答案 0 :(得分:2)

我猜你只想加载标签内的导航链接。

如果是这样,只需替换

$('a', ui.panel).click(function() {

使用

$('#navi a', ui.panel).click(function() {

虽然,我建议您使用class来选择导航div,而不是使用id,因为您最终可能会遇到重复的id,这可能会导致以后出现问题。