jQuery的獲得輸入元素在不同的父元素

Question

的Html

<div>         
    <div> 
     <input type="text" class="search_input form-control" placeholder="Search..."></div> 
     <span> 
     <img src="images/btn-reset-search.png" class="clear_text" alt=""> 
     </span> 
</div> 

我想要得到的輸入字段，當我點擊了具有類名形象：clear_text。

我想：

$('.clear_text').parent().prev('input'); 

Answer 1

試試這個：

$('.clear_text').on("click", function() 
{ 
    $(this).closest("div").find("input"); 
}); 

它定位到第一父div（closest("div")），那麼它裏面搜索一個input（find("input")）。如果您不確定div元素可能具有多少個輸入，則可以使用input:first。

Answer 2

嘗試

$('.clear_text').parent().prev().find('input'); 

Answer 3

嘗試使用以下溶液：

$(function(){ 
    $(".clear_text").click(function(){ 
    var inputField = $(this).parent().closest('input[type="text"]'); 
    }) 
}) 

OR

$(function(){ 
    $(".clear_text").click(function(){ 
    var inputField = $(this).parent().parent().find('input[type="text"]'); 
    }) 
}) 

inputField這裏是所需的輸入。

Answer 4

解決方案：

$(document).on('click', '.clear_text', function(){ 
    var $input = $(this).closest("div").find("input"); 
    //do whatever you want with $input, $input.val(), $input.addClass(), etc.. 
});