div内の特定のクラスを持つ最も近いスパンを見つける

Question

error_spanで最も近いspanを見つけたいと思います。 jQueryを使ってどうすればいいですか？

<div class="form-group row"> 
    <div class="col-sm-4"> 
     <label for="reimburse_price" class="control label">Amount</label> 
    </div> 
    <div class="col-sm-8"> 
     <div> 
      <input type="text" name="reimburse_price" min="1" placeholder='0.00' class="form-control numberOnly" id="reimburse_price" required>   
     </div> 
     <div> 
      <span class="small text-danger error_span"></span>  
     </div> 
    </div> 
</div> 

私のjavascriptのは、私のjqueryの関数はここ

function checkNumInput(id){ 
    if ($(id).val() == "") { 
     $(id)[0].setCustomValidity('Please fill out this field'); 
     $(id).closest("span .error_span").text("Please fill out this field").removeClass("hidden").addClass("text-danger"); 
    } 
} 

Answer 1

あなたの現在のコードの問題がclosest()は、親要素を見て、まだspanは、あなたがしたいということですされ、ここで

$("#reimburse_price").blur(function(){ 
    checkNumInput("#reimburse_price"); 
}); 

ですfindはinputへの親の兄弟の子です。

問題を解決するには、inputとspanの両方の共通の親に移動し、そこからfind()を使用してください。試してみてください：

$("#reimburse_price").blur(function() { 
    checkNumInput('#' + this.id); 
}); 

function checkNumInput(id) { 
    var $input = $(id); 
    if ($input.val() == "") { 
     $input.get(0).setCustomValidity('Please fill out this field'); 
     $input.closest('.form-group').find('.error_span').text("Please fill out this field").toggleClass("hidden text-danger"); 
    } 
}