如何检测表单输入的值自设置以来是否发生了变化

How to detect whether a form input's value has changed since set

本文关键字：设置 是否 变化 发生了 何检测 检测 输入 表单      更新时间：2023-09-26

我目前正在创建一个定制的CMS。我正在处理的具体部分与管理图片库有关。在用户可以更新某个相册中的详细信息的页面上，我使用jQuery的$.ajax进行了大量的更新。

例如，每个图像旁边都有一个标题字段，我将focusout事件绑定到我的ajax调用，这工作得非常好，并且使用户可以快速浏览和更新照片的所有标题。

然而，由于我绑定了focusout事件，它可能会被调用很多次，特别是在没有必要的时候。例如，他们在三个不改变的字段中分页。每次他们按tab键时，即使他们没有改变输入值，也会进行$.ajax调用。

所以，我的问题是如何存储和检测一个值是否不同于它最初(或最后一次ajax调用)?

可以使用jQuery的.data()吗?

正确执行此操作的关键是将数据与输入字段分开。当用户模糊输入框时，您可以根据内存中的数据检查该值。如果值不同，则执行ajax请求。如果没有，你什么都不做，节省往返的时间。

你可以自己写这些，但是最近几年出现的一些框架在这方面做得很好。其中包括:

Backbone.js

Spine.js

Knockout.js

Backbone似乎是其中最受欢迎的。

您必须将原始值存储在隐藏的输入类型中，并在每个focusout事件中比较原始值和当前值。

使用非常简单的jQuery解决:

在document.ready: 

$('.caption_field').each(function() {
    var startval = $(this).val();
    $(this).data('setval',startval);
});

ajax调用时:

if (caption == $(this).data('setval')) return; // not changed

当调用成功返回时:

field.data('setval',caption);
相关文章：