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
这两天项目中碰到个问题:
用户输入某些数据(或通过jQuery.val()
更新某些输入框的值),点击保存后,需要临时缓存部分html,待页面刷新后再append到页面上。但是通过jQuery.html()
方法获得的html,用户输入的数据丢失了(input, select
等)。
HTMLInputElement
有value
和defaultValue
两个属性;通过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.
网友评论