87,910
社区成员
发帖
与我相关
我的任务
分享jquery 1.9.0的attr("value")和val() 取值差异?
今天jquery1.5升级1.9,发现
<input type="text" name="test" id="test" />
居然用attr("value")取到的值为"",改用val()才能获得我所填的值.
重写html为
<input type="text" name="test" id="test" value="123"/>
发现attr("value")=123 ,而val()=所填的值.
于是有测试了一下1.6到1.8.3,
发现1.8.3还没有这个问题,1.9.0就出现了.
大致看了一下1.9.0的升级文档,好像没有哪个地方写了这个改动.
求教!!
<input type="text" name="test" id="test" />
居然用attr("value")取到的值为"",改用val()才能获得我所填的值.
重写html为
<input type="text" name="test" id="test" value="123"/>
发现attr("value")=123 ,而val()=所填的值.
于是有测试了一下1.6到1.8.3,
发现1.8.3还没有这个问题,1.9.0就出现了.
大致看了一下1.9.0的升级文档,好像没有哪个地方写了这个改动.
求教!!
...全文
请发表友善的回复…
发表回复
快乐起航2020 2014-07-18
- 打赏
- 举报
围观诸位大神的回答
天际的海浪 2013-03-28
- 打赏
- 举报
可能是和attr("checked")一样，1.9中做了更改
天际的海浪 2013-03-28
- 打赏
- 举报
attr("value") 好像是等于 defaultValue
天际的海浪 2013-03-28
- 打赏
- 举报
楼主的意思是当用户改变了文本框的值后
attr("value")=原来的默认值 ,而val()=用户改变的值.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<input type="text" name="test" id="test" value="123"/><input type="button" value="ok" onclick="ok()" />
<script type="text/javascript">
function ok(){
alert($("#test").val()+"|"+$("#test").attr("value"));
}
</script>
</body>
</html>
ftiger 2013-03-28
- 打赏
- 举报
嗯，源码，好象和浏览器有关
//jq line:2537
// fix oldIE value attroperty
if ( !getSetInput || !getSetAttribute ) {
jQuery.attrHooks.value = {
get: function( elem, name ) {
var ret = elem.getAttributeNode( name );
return jQuery.nodeName( elem, "input" ) ?
// Ignore the value *property* by using defaultValue
elem.defaultValue :
ret && ret.specified ? ret.value : undefined;
},
set: function( elem, value, name ) {
if ( jQuery.nodeName( elem, "input" ) ) {
// Does not return so that setAttribute is also used
elem.defaultValue = value;
} else {
// Use nodeHook if defined (#1954); otherwise setAttribute is fine
return nodeHook && nodeHook.set( elem, value, name );
}
}
};
}
//Line 1332
// Test setAttribute on camelCase class. If it works, we need attrFixes when doing get/setAttribute (ie6/7)
getSetAttribute: div.className !== "t",
//Line 1406
// Check if we can trust getAttribute("value")
input = document.createElement("input");
input.setAttribute( "value", "" );
support.input = input.getAttribute( "value" ) === "";
leipp 2013-03-28
- 打赏
- 举报
不只是IE的问题
是IE
//2509行
if ( !getSetInput || !getSetAttribute ) {
jQuery.attrHooks.value = {
get: function( elem, name ) {
var ret = elem.getAttributeNode( name );
return jQuery.nodeName( elem, "input" ) ?
// Ignore the value *property* by using defaultValue
elem.defaultValue :
ret && ret.specified ? ret.value : undefined;
},
}
attrHooks: {
type: {
set: function( elem, value ) {
if ( !jQuery.support.radioValue && value === "radio" && jQuery.nodeName(elem, "input") ) {
// Setting the type on a radio button after the value resets the value in IE6-9
// Reset value to default in case type is set after value during creation
var val = elem.value;
elem.setAttribute( "type", value );
if ( val ) {
elem.value = val;
}
return value;
}
}
}
},
//2361行
attrHooks: {
type: {
set: function( elem, value ) {
// We can't allow the type property to be changed (since it causes problems in IE)
if ( rtype.test( elem.nodeName ) && elem.parentNode ) {
jQuery.error( "type property can't be changed" );
} else if ( !jQuery.support.radioValue && value === "radio" && jQuery.nodeName(elem, "input") ) {
// Setting the type on a radio button after the value resets the value in IE6-9
// Reset value to it's default in case type is set after value
// This is for element creation
var val = elem.value;
elem.setAttribute( "type", value );
if ( val ) {
elem.value = val;
}
return value;
}
}
},
// Use the value property for back compat
// Use the nodeHook for button elements in IE6/7 (#1954)
value: {
get: function( elem, name ) {
if ( nodeHook && jQuery.nodeName( elem, "button" ) ) {
return nodeHook.get( elem, name );
}
return name in elem ?
elem.value :
null;
},
set: function( elem, value, name ) {
if ( nodeHook && jQuery.nodeName( elem, "button" ) ) {
return nodeHook.set( elem, value, name );
}
// Does not return so that setAttribute is also used
elem.value = value;
}
}
},
scscms太阳光 2013-03-27
- 打赏
- 举报
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<input type="text" name="test" id="test" value="123"/>
<script type="text/javascript">
$(function(){
alert($("#test").val()+"|"+$("#test").attr("value"));
})
</script>
</body>
</html>
