單擊按鈕可從附近的輸入中獲取價值？

Question

我有一個按鈕，在HTML中輸入之後，我想使用該按鈕從該輸入中檢索值並執行操作。我面臨的問題是我的jQuery沒有找到那個值。

的HTML：

<div> 
    <input class="an-input" type="text"></input> 
    <button class="ui-state-default inputButton an-button">GO</button> 
</div> 

的JS：

$('.an-button').click(function() { 
    var inputValue = $('.an-button').prev('.an-input').find('input').val(); 
    window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0'); 
}); 

Answer 1

旅遊了DOM與closest：

var inputValue = $('.an-button').closest('div').find('input').val(); 

Fiddle

Answer 2

$('button.an-button').click(function() { 
    var inputValue = $('.an-input:text').val(); 
    ... rest of code 
}) 

Answer 3

嘗試刪除.find('input')，因爲.prev(".an-input")應該返回input元素。還要注意，<input />標籤是自封閉

$(".an-button").click(function() { 
 
    var inputValue = $(this).prev(".an-input").val(); 
 
    console.log(inputValue) 
 
    //window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> 
 
</script> 
 
<div> 
 
    <input class="an-input" type="text" /> 
 
    <button class="ui-state-default inputButton an-button">GO</button> 
 
</div>

Answer 4

要定位一個兄弟姐妹，那一定是相似類型的。

試試這個：

$('.an-button').click(function() { 
    var inputValue = $('.an-button').parent().find('.an-input').val(); 
    window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0'); 
}); 

Answer 5

輸入元素尚未結束標記

更多信息here

正確的是<輸入/ >