只想知道jQuery中this.value
和$(this).val()
有什么区别?我意识到,当我console.log this.value
和console.log $(this).val()
时,它们的结果都是不同的,这意味着this.value
≠$(this).val()
答案 0 :(得分:3)
在不带任何参数的情况下调用.val()
时,结果几乎总是相同。您可以查看源代码here,搜索val: function( value ) {
:
val: function( value ) {
var hooks, ret, valueIsFunction,
elem = this[ 0 ];
if ( !arguments.length ) {
if ( elem ) {
hooks = jQuery.valHooks[ elem.type ] ||
jQuery.valHooks[ elem.nodeName.toLowerCase() ];
if ( hooks &&
"get" in hooks &&
( ret = hooks.get( elem, "value" ) ) !== undefined
) {
return ret;
}
ret = elem.value;
// Handle most common string cases
if ( typeof ret === "string" ) {
return ret.replace( rreturn, "" );
}
// Handle cases where value is null/undef or number
return ret == null ? "" : ret;
}
return;
}
// other logic for when there are arguments
如果该元素确实存在,并且没有valHooks
,那么唯一真正可以做任何事情的实质行就是
ret = elem.value;
这将在最后返回。
请注意,您可以在包含 no 元素的jQuery集合上调用.val()
,在这种情况下,将返回空字符串。 (相反,尝试访问不存在的元素的.value
会引发错误)
valHooks
用于检索某些无法通过.value
访问的元素的值,例如<select>
,但这仅与极其古老的过时浏览器有关- 或(如果脚本编写者已手动分配给$.valHooks
的属性。
答案 1 :(得分:2)
只是想知道jQuery中this.value和$(this).val()有什么区别?
这取决于上下文。正确使用后,它们与完全相同,除了textareas :
目前,在元素上使用.val()会从浏览器报告的值中去除回车符。但是,当此值通过XHR发送到服务器时,回车符将保留(或由不包含在原始值中的浏览器添加)。
我认为这真的是提出问题:
如果.value做同样的事情,为什么.val()存在。
这是因为当您使用jQuery选择元素$('#myinput')
时,将返回HtmlElements数组,而不是单个元素。在这种情况下,代码将必须使用属性('#myinput')[0].value = ('#myinput').val()
对元素进行索引以获得值。因此,val()
是一个不错的捷径,在某些情况下提供了一种错误处理。
当集合中的第一个元素为select-multiple时(即,设置了multi属性的select元素),. val()返回一个数组,其中包含每个选定选项的值。从jQuery 3.0开始,如果未选择任何选项,它将返回一个空数组;否则,它将返回一个空数组。在jQuery 3.0之前,它返回null。
与jQuery选择器一起使用时,它们肯定不是一回事。