Question

我有一个任务要做jquery选项卡。每个选项卡都有一些特殊功能。当加载页面时，它会转到第一个选项卡。我想将第二个选项卡设置为选中＆gt;我怎样才能做到这一点？我的代码是

 <script type='text/javascript'>//<![CDATA[ 
    $(window).load(function(){
     $(function() {
      $("#tabs").tabs();
      $("#tabs").tabs("option", {
        "selected": 2,
        "disabled": [1,2,3]
      });

    $( "input[type=checkbox]" ).click(function(){
        if ($(this).is(':checked')) {
         $('#tabs').tabs("enable", $(this).val());
         $('#tabs').tabs("select", $(this).val() );
        }
        else{
             $('#tabs').tabs("disable", $(this).val());
        }
    });
    });
    });//]]>  

    </script>


    </head>
    <body>
         <div id="tabs">
  <ul>
    <li><a href="#tabs-1">Nithin</a> </li>
    <li><a href="#tabs-2">Vipin</a></li>
    <li><a href="#tabs-3">Sachin</a></li>
    <li><a href="#tabs-4">Ganguly</a></li>
  </ul>
  <div id="tabs-1">
    <p>Nithin</p>
  </div>
  <div id="tabs-2">
  <form name="nithin">
  <b>Name</b>
  <input type="text" id="name">
    <input type="submit" value="submit" id="submit"/>
    </form>
  </div>
   <div id="tabs-3">
    <p>Sachin</p>
  </div>
   <div id="tabs-4">
    <p>Ganguly</p>
  </div>
</div>
<input type="checkbox" name="tabs-1" value="1">tabs-1 
<input type="checkbox" name="tabs-2" value="2">tabs-2 
<input type="checkbox" name="tabs-3" value="3">tabs-3 
<input type="checkbox" name="tabs-4" value="4">tabs-4 
<br>

    </body>


    </html>

您可以从http://jsfiddle.net/2aQ2g/35/

查看

Answer 1

那是因为你禁用了它。改为：

  $("#tabs").tabs("option", {
    "selected": 2,
    "disabled": [1,3]
  });

工作示例：http://jsfiddle.net/basarat/2aQ2g/34/

更新要根据提交的数据更改页面，您应该修改在服务器页面上输出的内容。如果选择2而不是将其放入禁用列表中。

更新2 如果您希望阻止页面在提交时重新加载，则需要执行自定义表单处理：

 // Do custom submit handling : 
 $('form').unbind('submit').submit(function(e)
                     {
                         e.preventDefault();
                         // place logic here: 
                     }
 );

示例：http://jsfiddle.net/basarat/2aQ2g/37/

Answer 2

$(document).ready(function() {    
 $( "#tabs" ).tabs( "option", {"selected":1, "disabled": [0, 2, 3 ] });
)};

如何在提交表单时将第二个选项卡设置为已选中

2 个答案: