帶輸入值的內部HTML

對於已輸入的innerHTML和輸入值有一個簡短的問題。請參閱下面的簡單例子（使用jQuery爲了方便）：帶輸入值的內部HTML

的jQuery：

jQuery(document).ready(function($) { 
    $('.send').click(function() { 
     alert($('.content').html()); 
     return false; 
    }); 
});

HTML：

<div class="content"> 
    <input type="text" name="input" value="Old Value" /> 
    <input type="button" class="send" value="Send" /> 
</div>

如果編輯的輸入值，然後點擊「發送」按鈕，該警報顯示innerHTML已獲得聯繫將輸入與「舊值」相比較，而不是用戶輸入的值。爲什麼是這樣？我們怎樣才能得到HTML作爲一個字符串與用戶輸入的輸入值？

來源

2012-08-25 Matthew Ruddy

，可以通過inputelement.value來獲得的值，修改所述值不影響該屬性。如果您希望具有新值的html只將該屬性設置爲新值。

對於設定選中屬性複選框，單選按鈕，設置innerHTML的文本區域，選擇設置所選屬性的選項

http://jsfiddle.net/mowglisanu/F7urT/5/

來源

2012-08-25 23:38:29 Musa

謝謝，簡單，但由於某種原因沒有發生在我身上。其他類型的表單域呢？選擇框，textareas等？問題應該提到這個而不是嚴格的輸入;我很抱歉。 –

@MatthewRuddy查看更新 – Musa

謝謝。非常簡單，真的應該自己處理這件事。固執導致我浪費時間試圖找出InnerHTML正在發生的事情，而不是實現一個簡單的解決方案。再次感謝。相信它實際上獲得了當前的HTML，包括任何已更改的輸入值等，而不是逐字讀取源代碼。 –

你不能得到.innerHTML（.html()）。寫入元素不會修改html標記，也不會更改實際標記中的value屬性。

您只能通過直接詢問元素的.value-值來訪問當前內容。使用jQuery，你也可以通過.val()來做到這一點。

來源

2012-08-25 23:37:36 jAndy

$('#input_id').attr('value',$('#input_id').val());
將把值到新的值被存儲爲屬性不是一個屬性的HTML

來源

2012-08-25 23:38:15 orhanhenrik

這個解決方案是更好的。爲更多的投入而工作。

$('input[type=text]').attr('value', function (i, val) { return val; }); 
    $('input[type=checkbox],input[type=radio]').attr('checked', function() { return this.checked; }); 
    $('textarea').html(function() { return this.value; }); 
    $('select').find(':selected').attr('selected', 'selected');

來源

2014-10-27 10:32:53 DanCZ

帶輸入值的內部HTML

回答

相關問題