jQuery .data()无法使用$(this)

Question

我想存储我的input字段的初始数据(以便稍后能够检查这些初始值).因此,当我的页面加载时,我使用以下代码段:

$(document).ready(function () {
    $('input').data('initial-value', $(this).val() )
}

问题是上面的内容没有input在数据属性中存储字段的初始值initial-value.该属性未创建.

以下工作:

$('input').data('initial-value', 'whatever value' )

我不能$(this)在.data()方法中使用jQuery 运算符吗？如果是这样,我还能做什么？

Answer 1

您将需要一些迭代,并将为您.each设置正确的this参考:

$('input').each(function() {
    $.data(this, 'initial-value', this.value);
});

小提琴

我已经使用了$.data提供更好性能的静态方法,但您也可以使用$(this).data('initial-value', this.value).

此外,this.value将很好地提供并提供比$(this).val()- 更好的性能- 缺点是当您具有属性的select元素时,该multiple属性.val()返回具有所选值的数组,而.value仅返回第一个值.

但是,您可以通过元素的defaultValue属性获取初始值.例如:

console.log( $('input')[0].defaultValue );

小提琴

请注意,此方法不适用于select元素.这将需要迭代select的option元素并检查它们的defaultSelected属性,但在这种情况下,更容易使用前一个解决方案.