HTML value vs defaultValue

1362 ワード

https://developer.mozilla.org/en/docs/Web/API/HTMLInputElement http://stackoverflow.com/questions/11853666/html-method-wrong-when-input-value-has-changed http://stackoverflow.com/questions/7095956/jquery-html-does-not-return-changed-values
この2日間のプロジェクトで問題が発生しました.ユーザーはいくつかのデータを入力し(またはjQuery.val()を通じていくつかの入力ボックスの値を更新します)、保存をクリックした後、htmlの一部を一時的にキャッシュする必要があります.ページがリフレッシュされてからappendがページに表示されます.しかしjQuery.html()法で得られたhtmlでは,ユーザが入力したデータが失われた(input, select等).HTMLInputElementにはvaluedefaultValueの2つの属性がある.jQuery.val()メソッド(またはユーザ入力)によってvalueプロパティのみが変更され、valueを変更してもhtmlにマッピングされません.したがってjQuery.html()法によりhtmlの初期値が取得される.
解決方法:defaultValue属性がhtmlにマッピングされるので、value属性をdefaultValueに設定すればよい.
/**
 *   form      
 * @param $dom jQuery(form)  
 */
function updateFormDefaultValue($dom){
    $dom.find('[type=text], textarea').each(function(){ this.defaultValue = this.value; });
    $dom.find('[type=checkbox], [type=radio]').each(function(){ this.defaultChecked = this.checked; });
    $dom.find('select option').each(function(){ this.defaultSelected = this.selected; });
}
jQuery.attr('value', someValue)法によりhtmlにマッピングすることもできる.