5

好的,所以我有这个 Jquery,它将切换页面上的一些单选按钮。我想要它,所以当有人点击其中一个单选按钮时,其他人不会被点击。目前我拥有它的方式,他们一次可以选择 3 个,我需要它像一个普通的单选按钮一样,一个被点击,其他的没有

jQuery:

$(function () {
  $('.box-ul .btn .dot').click(function () {
    $(this).toggleClass('clicked');
  });
});

HTML:

<div class="box-ul box-video right">
    <ul>
        <li><span class="yes"></span><p>Easy to Use</p></li>
        <li><span class="yes"></span><p>Step by Step<br /><span>details instructions</span></p></li>
        <li><span class="yes"></span><p>Setup time<br /><span>under 30 mins</span></p></li>
        <li class="btn btn-expanded">
          <div class="btn-t">
            <span class="dot left"></span>
          <p class="left">Expanded<br />
            <span>This is the extend button It has space for slightly more info.</span>
          </p>
            <div class="cl">&nbsp;</div>
          </div>
        </li>
        <li class="btn">
          <div class="btn-t">
            <span class="dot left"></span>
            <p class="left">Green Doggies</p>
            <div class="cl">&nbsp;</div>
          </div>
          </li>
        <li class="btn">
          <div class="btn-t">
            <span class="dot left"></span>
            <p class="left">Email Support</p>
            <div class="cl">&nbsp;</div>
          </div>
        </li>
    </ul>
</div>
4

2 回答 2

10

在所有不是您首先单击.removeClass()的匹配元素上使用类,如下所示:

$('.box-ul .btn .dot').click(function () {
  $('.box-ul .btn .dot').not(this).removeClass('clicked');    
  $(this).toggleClass('clicked');
});​

你可以在这里测试它。在这种情况下,我们将选择所有其他匹配的'.box-ul .btn .dot'元素,过滤掉我们点击的元素,.not()然后对它们执行 a.removeClass()操作。最后一部分仍然是 a .toggleClass(),因此您也可以通过单击活动的部分来取消选择。如果您不想取消选择(更像是单选按钮),那么只需将其更改为.addClass().

于 2010-07-18T20:53:32.263 回答
0

而不是一个毯子 .removeClass() 一切,我会做:

$(this).closest('.box-ul').find('.btn .dot').not(this).removeClass('clicked');

这只会取消选择单击的单选按钮的 .box-ul 中的那些。

于 2010-07-18T20:56:55.780 回答