有沒有辦法找到最接近的元素，它不是標籤，也沒有類

Question

給出一個元素，我需要找到最接近的元素，它不是label，也不是一個具有類的元素radio或checkbox

這裏是我做了什麼

$parent = element.closest('div'); 

if($parent.hasClass('checkbox') || $parent.hasClass('radio')) 
{ 
    $parent = $parent.parent(); 
} 

error.appendTo($parent); 

上面的代碼工作的大部分，除了它只是尋找一個div沒有任何元素。

另外，有沒有更簡單的方法來寫這段代碼，我可以避免條件聲明？也許，使用find()方法來搜索，但不知道如何使用它。

這裏是我試圖尋找

<div class="form-group has-error"> 
    <label for="gender" class="col-md-2 control-label">Gender</label> 
    <div class="col-md-10"> 
     <div class="radio"> 
      <label for="gender_"> 
       <input id="gender_" required="1" name="gender" value="" aria-required="true" aria-describedby="gender-error" type="radio"> 
       Please select your gender 
      </label> 
     </div> 
     <div class="radio"> 
      <label for="gender_1"> 
       <input id="gender_1" required="1" name="gender" value="1" aria-required="true" type="radio"> 
       Male 
      </label> 
     </div> 
     <div class="radio"> 
      <label for="gender_2"> 
       <input id="gender_2" required="1" name="gender" value="2" aria-required="true" type="radio"> 
       Female 
      </label> 
     </div> 

    </div> 
</div> 

我希望能夠appent與類「COL-MD-10」的DIV的HTML代碼。

不是它並不總是一個div或事件的同一類這就是爲什麼我要搜索未在.closest()選擇器標籤選框或課堂上使用:not(input, label, .checkbox, .radio)的

Answer 1

最接近的元素。我添加了input，因爲.closest()開始使用已使用的元素（input）進行檢查。

注：如果你知道你正在尋找與類的元素，你可以使用.closest('.col-md-10')。

var result = $('input').closest(':not(input, label, .checkbox, .radio)'); 
 

 
console.log(result[0]);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="form-group has-error"> 
 
    <label for="gender" class="col-md-2 control-label">Gender</label> 
 
    <div class="col-md-10"> 
 
     <div class="radio"> 
 
      <label for="gender_"> 
 
       <input id="gender_" required="1" name="gender" value="" aria-required="true" aria-describedby="gender-error" type="radio"> 
 
       Please select your gender 
 
      </label> 
 
     </div> 
 
     <div class="radio"> 
 
      <label for="gender_1"> 
 
       <input id="gender_1" required="1" name="gender" value="1" aria-required="true" type="radio"> 
 
       Male 
 
      </label> 
 
     </div> 
 
     <div class="radio"> 
 
      <label for="gender_2"> 
 
       <input id="gender_2" required="1" name="gender" value="2" aria-required="true" type="radio"> 
 
       Female 
 
      </label> 
 
     </div> 
 

 
    </div> 
 
</div>