打开具有特定标签的链接

时间:2012-11-29 11:13:47

标签: jquery

在页面中我有这样的标签

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">1</a></li>
        <li><a href="#tabs-2">2</a></li>
        <li><a href="#tabs-3">3</a></li>
    </ul>

    <div id="tabs-1">
       1
    </div>


    <div id="tabs-2">
      2

    </div>
    <div id="tabs-3">
3
    </div>
</div>

和表单中的提交按钮

当我点击提交时,我需要在同一页面中打开特定标签

谢谢

2 个答案:

答案 0 :(得分:1)

试试这个

<script language="javascript" type="text/javascript">
    $('#tabs').tabs();
    function select_tab(tabeName){
       $('#tabs').tabs('select', '#'+tabname);
    }
</script>

html提交

<input name="" type="button" onclick='select_tab("tab1")' value="submit"/>

答案 1 :(得分:0)

如果你使用jqueryui标签,这可以这种方式; 当您单击按钮时,它将选择第二个选项卡

首先加载jquery和jqueryui

<link href="css/smoothness/jquery-ui-1.9.0.custom.css" rel="stylesheet">
<script language="javascript" type="text/javascript" src="jquery-1.8.2.js"></script>
<script src="js/jquery-ui-1.9.0.custom.js"></script>
<script language="javascript" type="text/javascript">
$(function(){
    $("#tabs").tabs();// initiate tabs with jqueryui
});
</script>

Html代码

我们也可以在标签外面设置按钮,但是这里我将它包含在第一个标签页

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">1</a></li>
        <li><a href="#tabs-2">2</a></li>
        <li><a href="#tabs-3">3</a></li>
    </ul>
    <div id="tabs-1">
       1
       <input name="" type="button" onclick='$("#tabs").tabs( "select", "tabs-2" )' value="select tab2"/>
    </div>
    <div id="tabs-2">
      2

    </div>
    <div id="tabs-3">
     3
    </div>
</div>

示例:Jsfiddle demo

相关问题