一个<input>元素的jQuery更改事件 – 以任何方式保留以前的值？
我今天早上一直在寻找，我没有find任何简单的解决scheme…基本上，我想捕捉一个input元素的变化，但也知道以前的值。
这是最简单forms的更改事件和input元素。 显然，我可以用$（elem）.val（）获得新的值，但是有没有一个偷偷摸摸的方法，我失去了以前的价值？ 我没有看到任何jQuery API来做到这一点，但也许有人已经这样做，并有一些提示？
<script> $(document).ready(function(){ $('#myInputElement').bind('change', function(){ //var oldvalue = ??? var newvalue = $(this).val(); }); }); </script> <input id="myInputElement" type="text"> 我不反对写我自己的解决scheme，我只是想确保我没有在这里重新创build轮子。
更好的方法是使用.data存储旧值。 这将避免创build一个全局variables，您应该远离并保持信息封装在元素中。 这里logging一个真实世界的例子，为什么全球变差是不好的
例如
<script> //look no global needed:) $(document).ready(function(){ // Get the initial value var $el = $('#myInputElement'); $el.data('oldVal', $el.val() ); $el.change(function(){ //store new value var $this = $(this); var newValue = $this.data('newVal', $this.val()); }) .focus(function(){ // Get the value when input gains focus var oldValue = $(this).data('oldVal'); }); }); </script> <input id="myInputElement" type="text">
这可能会诀窍：
$(document).ready(function() { $("input[type=text]").change(function() { $(this).data("old", $(this).data("new") || ""); $(this).data("new", $(this).val()); console.log($(this).data("old")); console.log($(this).data("new")); }); });
在这里演示
$('#element').on('change', function() { $(this).val($(this).prop("defaultValue")); });
只要焦点离开input字段（应该做你想要的），你可以将input字段的值复制到隐藏字段。 见下面的代码：
<script> $(document).ready(function(){ $('#myInputElement').bind('change', function(){ var newvalue = $(this).val(); }); $('#myInputElement').blur(function(){ $('#myHiddenInput').val($(this).val()); }); }); </script> <input id="myInputElement" type="text">
（未经testing，但它应该工作）。
每个DOM元素都有一个名为defaultValue的属性。 如果您只是想比较第一次更改的数据，则可以使用它来获取默认值。
在Russ的回答中，他将焦点事件绑定在一起。 我不认为这是必要的。
您可以将旧值存储在更改事件中。
<script> $(document).ready(function(){ var newValue = $('#myInputElement').val(); var oldValue; $('#myInputElement').change(function(){ oldValue = newValue; newValue = $(this).val(); }); }); </script> <input id="myInputElement" type="text">
有些观点
使用$ .data而不是$ .fn.data
// regular $(elem).data(key,value); // 10x faster $.data(elem,key,value);
然后，您可以通过事件对象获取以前的值，而不会使您的生活复杂化：
$('#myInputElement').change(function(event){ var defaultValue = event.target.defaultValue; var newValue = event.target.value; });
被警告defaultValue不是最后的设定值。 这是该领域初始化的价值。 但是，您可以使用$ .data来跟踪“oldValue”
我build议你总是在你的事件处理函数中声明“事件”对象，并用萤火虫（console.log（event））来检查它们。 你会发现很多有用的东西，这将节省您创build/访问jquery对象（这是伟大的，但如果你可以更快…）
我根据Joey Guerra的build议创build了这些function，非常感谢。 我正在详细阐述一下，也许有人可以使用它。 第一个函数checkDefaults（）在input改变时被调用，第二个函数在使用jQuery.post提交时被调用。 div.updatesubmit是我的提交button，类'needsupdate'是一个指示，表示更新已经完成，但尚未提交。
function checkDefaults() { var changed = false; jQuery('input').each(function(){ if(this.defaultValue != this.value) { changed = true; } }); if(changed === true) { jQuery('div.updatesubmit').addClass("needsupdate"); } else { jQuery('div.updatesubmit').removeClass("needsupdate"); } } function renewDefaults() { jQuery('input').each(function(){ this.defaultValue = this.value; }); jQuery('div.updatesubmit').removeClass("needsupdate"); }
我发现一个肮脏的伎俩，但它的工作原理，你可以使用hoverfunction来获得更改前的价值！
