Javascript 如何在文本框中使用 onchange() 事件获取旧值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1909992/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get old Value with onchange() event in text box
提问by CFUser
I have a text Box and a Value poplulated in it when page loads. Now If user chanegs any thing in text box, then I want to get the Changed Value(New Value) and Old Value but when I do ELEMENT.value then its giving only changed Value
当页面加载时，我有一个文本框和一个填充在其中的值。现在，如果用户在文本框中更改任何内容，那么我想获取更改的值（新值）和旧值，但是当我执行 ELEMENT.value 时，它只给出更改的值
any Suggestions to get old value?
任何获得旧价值的建议？
below is my code
下面是我的代码
<head>
<script type="text/javascript">
function onChangeTest(changeVal) {
alert("Value is " + changeVal.value);
}
</script>
</head>
<body>
<form>
<div>
<input type="text" id="test" value ="ABS" onchange="onChangeTest(this)">
</div>
</form>
</body>
</html>
Thanks in Advance
提前致谢
采纳答案by George
element.defaultValuewill give you the original value.
element.defaultValue会给你原来的价值。
Please note that this only works on the initial value.
请注意，这只适用于初始值。
If you are needing this to persist the "old" value every time it changes, an expando property or similar method will meet your needs
如果您需要在每次更改时保留“旧”值，则 expando 属性或类似方法将满足您的需求
回答by Gabriel McAdams
You'll need to store the old value manually. You could store it a lot of different ways. You could use a javascript object to store values for each textbox, or you could use a hidden field (I wouldn't recommend it - too html heavy), or you could use an expando property on the textbox itself, like this:
您需要手动存储旧值。你可以用很多不同的方式存储它。您可以使用 javascript 对象来存储每个文本框的值，或者您可以使用隐藏字段（我不推荐它 - html 太重），或者您可以在文本框本身上使用 expando 属性，如下所示：
<input type="text" onfocus="this.oldvalue = this.value;" onchange="onChangeTest(this);this.oldvalue = this.value;" />
Then your javascript function to handle the change looks like this:
然后您处理更改的 javascript 函数如下所示：
<script type="text/javascript">
function onChangeTest(textbox) {
alert("Value is " + textbox.value + "\n" + "Old Value is " + textbox.oldvalue);
}
</script>
回答by krsnik
I would suggest:
我会建议：
function onChange(field){
field.old=field.recent;
field.recent=field.value;
//we have available old value here;
}
回答by tiwari.vikash
You should use HTML5 data attributes. You can create your own attributes and save different values in them.
您应该使用 HTML5 数据属性。您可以创建自己的属性并在其中保存不同的值。
回答by Alex
I am not sure, but maybe this logic would work.
我不确定，但也许这个逻辑会奏效。
var d = 10;
var prevDate = "";
var x = 0;
var oldVal = "";
var func = function (d) {
if (x == 0 && d != prevDate && prevDate == "") {
oldVal = d;
prevDate = d;
}
else if (x == 1 && prevDate != d) {
oldVal = prevDate;
prevDate = d;
}
console.log(oldVal);
x = 1;
};
/*
============================================
Try:
func(2);
func(3);
func(4);
*/
回答by Pham Thai Son
You can do this: add oldvalue attribute to html element, add set oldvalue when user click. Then onchange event use oldvalue.
您可以这样做：将 oldvalue 属性添加到 html 元素，在用户单击时添加 set oldvalue。然后onchange 事件使用oldvalue。
<input type="text" id="test" value ="ABS" onchange="onChangeTest(this)" onclick="setoldvalue(this)" oldvalue="">
<script>
function setoldvalue(element){
element.setAttribute("oldvalue",this.value);
}
function onChangeTest(element){
element.setAttribute("value",this.getAttribute("oldvalue"));
}
</script>
回答by Jon
A dirty trick I somtimes use, is hiding variables in the 'name' attribute (that I normally don't use for other purposes):
我有时使用的一个肮脏的技巧是在 'name' 属性中隐藏变量（我通常不用于其他目的）：
select onFocus=(this.name=this.value) onChange=someFunction(this.name,this.value)><option...
Somewhat unexpectedly, both the old and the new value is then submitted to someFunction(oldValue,newValue)
有点出乎意料的是，旧值和新值都被提交给 someFunction(oldValue,newValue)
回答by Canavar
Maybe you can store the previous value of the textbox into a hidden textbox. Then you can get the first value from hidden and the last value from textbox itself. An alternative related to this, at onfocus event of your textbox set the value of your textbox to an hidden field and at onchange event read the previous value.
也许您可以将文本框的先前值存储到隐藏的文本框中。然后你可以从 hidden 中获取第一个值，从文本框本身获取最后一个值。与此相关的另一种方法是，在文本框的 onfocus 事件中将文本框的值设置为隐藏字段，并在 onchange 事件中读取先前的值。
回答by ownking
Maybe you can try to save the old value with the "onfocus" event to afterwards compare it with the new value with the "onchange" event.
也许您可以尝试使用“onfocus”事件保存旧值，然后将其与带有“onchange”事件的新值进行比较。
