2

我正在使用下面的代码来查看用户是否正在更改任何表单元素。

var content = [];
$(":input").each(function(i,item){
  content[i] = $.trim($(item).val()) || $(item).prop("checked");
    $(item).on('input, change', function(data) {
        var currentVal = $.trim($(this).val());
        if(currentVal != content[i]) console.log("changed");
        else console.log("no change");
    })
});

console.log(content);

它工作正常，除了单选和复选框控件。如何检查这些变化？这是我在jsfiddle制作的示例，有人建议我最好的方法吗？

我根据 yckart 的建议修改了该功能，它可以正常工作。但我没有像与复选框或单选按钮交互那样获得实时更新。如果有人建议/纠正我的功能，我将不胜感激。

这是我的功能：

var content = [];
$(":input").each(function (i, item) {
    if (!item.value.match(/on|off/)) {
        content[i] = $.trim($(item).val())
    } else {
        content[i] = $(item).prop("checked");
    }
    $(item).on('input, change', function (data) {
        var currentVal = !$(this).val().match(/on|off/) ? $.trim($(this).val())  : $(this).prop("checked") ;
        console.log(currentVal);
        if (currentVal != content[i]) console.log("changed");
        else console.log("no change");
    })
});

谢谢大家...

4

2 回答 2

1

经过长时间的奋斗，我找到了解决您问题的方法。

您需要OR在 if 语句.on()方法中移动条件。

var content = [];
$(":input").each(function (i, item) {
    content[i] = $.trim($(item).val());
    $(item).on('input, change', function (data) {
        var currentVal = $.trim($(this).val());
        if (currentVal != content[i] || $(item).prop("checked")) alert("changed");
        else alert("no change");
    })
});

原因：您获得了input字段的值，我不确定为什么值 for radioand checkboxare always "on"。

但是对于radio和使用他们的财产 checkbox会更好。checked

这是供您参考的JSFiddle 。

希望你能理解。

编辑： radio 和 checkbox 的默认值始终为“on”，即使它被选中，该值也不会改变。

于 2013-06-11T14:31:58.320 回答
0

简单，checkboxes并且radio-inputs 也有一个value( "on"& "off")。因此，只需检查该值是否不是其中之一：

var content = [];
$(":input").each(function (i, item) {
    if (!item.value.match(/on|off/)) {
        content[i] = $.trim(item.value)
    } else {
        content[i] = $(item).prop("checked");
    }
    $(item).on('input change', function (data) {
        var currentVal = $.trim(this.value);
        if (currentVal != content[i]) console.log("changed");
        else console.log("no change");
    })
});

console.log(content);

http://fiddle.jshell.net/VWDFv/4/

于 2013-06-11T13:13:56.200 回答