jQuery：從直接的'叔叔'中刪除類

我正在製作一個分爲多個部分的表單。每個部分都在它自己的DIV中，具有選項類別。jQuery：從直接的'叔叔'中刪除類

表單由包裹在標籤中的無線電輸入按鈕組成。（由於IE8兼容性原因，標籤HAS會將輸入封裝）*。當用戶點擊一個輸入按鈕時，我想使用jQuery爲父包裝標籤添加一個'tick'類。我也想從任何不是直接父母標籤的相鄰父標籤（即，叔叔）中刪除標籤類。但是，我只希望這種刪除發生在直接部分，而不是其他部分。

我該怎麼做？我以爲我可以用jQuery函數「最接近」來實現它，但它似乎不工作。

這裏是一個JS Fiddle

這裏是我的HTML：

<div class="daddyhair hairstyle hairoption option"> 
    <label for="chara2-hairdaddy1" onclick="" class="chara2-hairdaddy1 ticked" > 
     <input name="hairstyle" class="chara2-hairdaddy1" id="chara2-hairdaddy1" type="radio" value="chara2-hairdaddy1" checked="checked" /> 
    </label> 
    <label for="chara2-hairdaddy2" onclick="" class="chara2-hairdaddy2"> 
     <input name="hairstyle" id="chara2-hairdaddy2" type="radio" value="chara2-hairdaddy2" /> 
    </label> 
    <label for="chara2-hairdaddy3" onclick="" class="chara2-hairdaddy3"> 
     <input name="hairstyle" id="chara2-hairdaddy3" type="radio" value="chara2-hairdaddy3" /> 
    </label> 
    <label for="chara2-hairdaddy4" onclick="" class="chara2-hairdaddy4"> 
     <input name="hairstyle" id="chara2-hairdaddy4" type="radio" value="chara2-hairdaddy4" /> 
    </label> 
    <label for="chara2-hairdaddy5" onclick="" class="chara2-hairdaddy5 "> 
     <input name="hairstyle" id="chara2-hairdaddy5" type="radio" value="chara2-hairdaddy5" /> 
    </label> 
    <label for="chara2-hairdaddy6" onclick="" class="chara2-hairdaddy6 "> 
     <input name="hairstyle" id="chara2-hairdaddy6" type="radio" value="chara2-hairdaddy6" /> 
    </label> 
    <label for="chara2-hairdaddy7" onclick="" class="chara2-hairdaddy7 " > 
     <input name="hairstyle" id="chara2-hairdaddy7" type="radio" value="chara2-hairdaddy7" /> 
    </label> 
    <label for="chara2-hairdaddy8" onclick="" class="chara2-hairdaddy8 "> 
     <input name="hairstyle" id="chara2-hairdaddy8" type="radio" value="chara2-hairdaddy8" /> 
    </label> 
    <label for="chara2-hairdaddy9" onclick="" class="chara2-hairdaddy9 "> 
     <input name="hairstyle" id="chara2-hairdaddy9" type="radio" value="chara2-hairdaddy9" /> 
    </label> 
</div> 

     <div class="daddymoustache moustachestyle hairoption option"> 
      <label for="chara2-moustachedaddy1" onclick="" class="chara2-moustachedaddy1 ticked"> 
      <input name="moustachestyle" id="chara2-moustachedaddy1" type="radio" value="chara2-moustachedaddy1" checked="checked" /> 
      </label> 
      <label for="chara2-moustachedaddy2" onclick="" class="chara2-moustachedaddy2" > 
      <input name="moustachestyle" id="chara2-moustachedaddy2" type="radio" value="chara2-moustachedaddy2" /> 
      </label> 
      <label for="chara2-moustachedaddy3" onclick="" class="chara2-moustachedaddy3"> 
      <input name="moustachestyle" id="chara2-moustachedaddy3" type="radio" value="chara2-moustachedaddy3" /> 
      </label> 
     </div> 
     <div class="daddysideburn sideburnstyle hairoption option"> 
      <label for="chara2-sideburndaddy1" onclick="" class="chara2-sideburndaddy1 ticked"> 
      <input name="sideburnstyle" id="chara2-sideburndaddy1" type="radio" value="chara2-sideburndaddy1" /> 
      </label> 
      <label for="chara2-sideburndaddy2" onclick="" class="chara2-sideburndaddy2 "> 
      <input name="sideburnstyle" id="chara2-sideburndaddy2" type="radio" value="chara2-sideburndaddy2" /> 
      </label> 
     </div>

張貼的jsfiddle的代碼縮寫。完整的代碼使用CSS背景，如果輸入不包含在標籤中，則不會在IE8中工作。

來源

2013-08-04 big_smile

你在找？

我改變了一下你的代碼，而不是檢測點擊輸入，檢測點擊標籤本身。

$("label").click(function() 
{ 
    $(this).siblings("label.ticked").removeClass('ticked'); 
    $(this).addClass('ticked'); 
});

JSFIDDLE DEMO

來源

2013-08-04 15:05:12

請註明答案爲接受的，如果您的問題被解決。 –

jQuery：從直接的'叔叔'中刪除類

回答

相關問題