2011-07-07 200 views
0

我有一个jQuery选项卡脚本,它从链接定义的PHP文件获取内容并将其解析为div元素。当页面加载时,已经选择了一个选项卡,用户可以选择另一个选项。但是,当您单击选项卡以外的任何位置时,选定的选项卡将被删除。为什么会这样呢?jQuery选项卡脚本中的选定选项卡

这是我目前的jQuery代码:

function load(url){ 
    $.ajax({ 
     url:url, 
     success:function(message){ 
      $("#content").html(message); 
     } 
    }); 
} 

$(document).ready(function(){ 
    $("[id]").click(function(){ 
     type=$(this).attr("id"); 
     url=""+type+".php"; 
     $("[id]").removeClass("selected"); 
     $("#"+type).addClass("selected"); 
     load(url); 
     return false; 
    }); 
    $("#tab1").click(); 
}); 

这是我的HTML代码:

<ul> 
<li><a id="tab1" href="javascript:void(null);">Tab1</a></li> 
<li><a id="tab2" href="javascript:void(null);">Tab2</a></li> 
<li><a id="tab3" href="javascript:void(null);">Tab3</a></li> 
</ul> 

回答

0

jQuery选择表示目标与ID标签的所有元素。具有ID标签的页面上的任何元素都将分配点击处理程序。无论是这样,还是在javascript中,所有元素都有一个id属性。它通常设置为空/空。所以选择器主要针对所有标签。最后,这大致是一回事。我会建议做一个约定(就像你已经有的),并开始每个标签用tab_这个词,然后在jquery选择器使用类似[id^="tab_"]。然后选择器将获得以tab_开头的所有元素。

0

有一个更好的和易于使用的标签jQuery脚本供您参考

http://creativealive.com/easy-to-use-jquery-tabs-css-jquery/

+1

注意[仅链接答案](http://meta.stackoverflow.com/tags/link-only-答案/信息),所以SO答案应该是搜索解决方案的终点(而另一个参考文献的中途停留时间往往会随着时间的推移而变得过时)。请考虑在此添加独立的摘要,并将链接保留为参考。 – kleopatra

+0

谢谢,但我发现relivent –