jQuery选项卡脚本中的选定选项卡

时间:2011-07-07 23:28:00

标签: php javascript jquery html

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

这是我目前的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>

2 个答案:

答案 0 :(得分:0)

jquery选择器表示使用id标记定位所有元素。带有id标记的页面上的任何元素都将分配单击处理程序。它或者是,或者在javascript中,所有元素都具有id属性。它通常设置为null / empty。因此选择器基本上针对所有标签。最后,它大致是一回事。我建议制作一个约定(就像你已经拥有的那样)并用tab_之类的单词开始每个标签,然后在jquery选择器中使用[id^="tab_"]之类的内容。然后选择器将获得以tab_开头的所有元素。

答案 1 :(得分:0)

有一个更好且易于使用的tab jquery脚本供您参考

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