文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在选中复选框时启用选项卡

问如何在选中复选框时启用选项卡
EN

Stack Overflow用户

提问于 2013-03-04 17:09:43

回答 1查看 1.4K关注 0票数 2

我有一个任务要做Jquery标签页。关于这一点，当我选择一个复选框，相应的选项卡必须显示在页面上，其他的必须是disabled.Multiple复选框也是allowed.Then相应的页面必须启用。

我的代码是

<html !doctype>
<head>
<title>JqueryMenu</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
 <script type="text/javascript">
$(function() {
  $("#tabs").tabs();
  $("#tabs").tabs("option", {
    "selected": 2,
    "disabled": [1,2,3]
  });
$( "input[type=checkbox]" ).click(function(){
     $('#tabs').tabs("enable", $(this).val());
     $('#tabs').tabs("select", $(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">
    <p>Vipin</p>
  </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/4/

javascript

jquery

html

jquery-ui

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-03-04 17:19:27

你只需要在下面添加条件

if ($(this).is(':checked'))

请参阅fiddle here

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/15197965

复制

相似问题

问如何在选中复选框时启用选项卡
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在选中复选框时启用选项卡EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在选中复选框时启用选项卡
EN