更改後得到html元素值

Question

在視圖中，我試圖在我改變它之後檢索html輸入框的值。換句話說，加載的頁面爲

<input id="input_one" type="text" value = "apple" /> 

當頁面打開時，輸入框中包含蘋果詞。我點擊這個輸入框，刪除單詞蘋果，然後寫入單詞「橙色」代替。當我做到以下幾點：

$('#input_one').click(function() { 
    console.log($('#input_one').attr('value')); 
}); 

結果是「蘋果」不是橙色。有沒有辦法在不提交表單的情況下獲得我剛剛輸入的新值？我想在頁面上使用JavaScript來讓客戶端驗證，如果值是什麼，提交表單，否則顯示消息「值必須是什麼」

也許我可以做這樣的事情

$('#input_one').attr('value', 'new value'); 

但是我如何獲得剛投入的新價值呢？這個新值存儲在哪裏？ innerHTML的？或文本（）可能？

Answer 1

attr()將得到<input>的屬性，這是該元件的初始值。

元素的當前值是屬性。如果我們想獲得的任何元素屬性：

$('#input_one')[0].value;  
$('#input_one').prop('value'); 

然而， jQuery有完美的方法，.val(),你：

$('#input_one').val(); 

---

What is the difference between attribute and property?

Answer 2

嘗試這樣：

$("#input_one").blur(function() { 
    alert(this.value); 
}); 

此提醒輸入框的每一個你把它聚焦時間的新值。

Answer 3

嘗試.val()代替：

$('#input_one').val();