JQuery切換隻有1項，其他未點擊

好吧，我有這個JQuery會切換頁面上的一些單選按鈕。我想要它，所以當有人點擊其中一個單選按鈕時，其他人不會被點擊。目前，我有它的方式，他們可以一次選擇3，我需要它像一個被點擊常規單選按鈕行動和其他人不JQuery切換隻有1項，其他未點擊

的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>

來源

2010-07-18 Trace

使用.removeClass()類的所有匹配的元素不一個你在第一次點擊，這樣的：

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

You can test it here。在這種情況下，我們選擇所有其他匹配的'.box-ul .btn .dot'元素，篩選出我們用.not()點擊的元素，並對它們執行.removeClass()。最後一部分仍然是.toggleClass()，所以你可以通過點擊活動的取消選擇。如果你不要希望能夠取消選擇（甚至更像一個單選按鈕），那麼只需將其更改爲.addClass()。

來源

2010-07-18 20:53:32

非常感謝 – Trace 2010-07-18 20:58:24

@Matt - 歡迎:)編輯你的問題有點......只是爲了將來的參考，如果你將JavaScript和HTML分離成不同的代碼塊，你會得到更好的代碼高亮:) – 2010-07-18 21:08:53

而是一切毯子.removeClass（）的，我會做：

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

單擊的單選按鈕的.box的-UL內這僅表示取消的。

來源

2010-07-18 20:56:55 goffrie

如果您使用'.children（'。btn .dot'）''，那麼這將不起作用。 – user113716 2010-07-18 21:00:40

ack，你是對的。固定。 – goffrie 2010-07-18 21:27:02

JQuery切換隻有1項，其他未點擊

回答

相關問題