Question

基于这个问题：

我有input 1和input 2，value='100'

如果我更改了input 1值，则警告显示值已更改，perfet。

但如果我进入输入并失去焦点（我正在使用focusout()），警报将继续显示该值再次更改，可能是因为我正在使用类。 / p>

我无法将其付诸实践，我不知道该怎么办？

HTML ：

<input type="text" value="100" class="inputTest" />
<input type="text" value="100" class="inputTest" />

JS：

$(".inputTest").focusout(function(){
   if(this.value != this.defaultValue){
        alert('changed');
    } 
});

制作了live example。

感谢。

Answer 1

使用data()方法存储放入input的最后一个值。然后，您可以更改逻辑以针对此进行测试，而不是默认值。

$(".inputTest").each(function() {
    $(this).data("lastValue", this.value);
})

$(".inputTest").focusout(function() {
    if (this.value != $(this).data("lastValue")) {
        alert('changed');
        $(this).data("lastValue", this.value)
    }
});

Fiddle here

Answer 2

也许您应该使用更改处理程序而不是focusout处理程序。这样，只有在值发生变化时才会检查值。

Answer 3

问题是你在焦点上测试value != defaultValue，一旦值被更改一次，这显然永远不会成立，直到它再次被更改。

您需要检查是否this.value != this.previousValue，并以某种方式存储字段的上一个值。

编辑：@Rory McCrossan已在他的回答中详细描述了如何做到这一点。

Answer 4

defaultValue将始终包含100.如果更改输入框的内容，则defaultValue不会更改。

考虑存储以前的值：

// Initialize previousValue
$(".inputTest").each(function () {
    $(this).data('previousValue', this.defaultValue);
});

$(".inputTest").focusout(function(){
   if(this.value != $(this).data('previousValue')){
        alert('changed');
        // Set previousValue again
        $(this).data('previousValue', this.value);
    } 
});

使用类进行输入值变化检测

4 个答案: