javascript 如何使用javascript捕获旧值并将其设置为取消
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16931691/
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 capture old value and set it back on cancel using javascript
提问by Anuj Balan
I have a text field from which I am calling a function on onChangeevent. I am throwing a confirm window here when the value in that textfield is changed. If cancel is clicked( in confirm window), the old value must get set back into the text field. If proceed or ok is clicked, the new value should be retained.
I have been trying this for a long time but am unable to retain the old value.
我有一个文本字段，我从中调用onChange事件函数。当该文本字段中的值发生更改时，我会在此处抛出一个确认窗口。如果单击取消（在确认窗口中），则必须将旧值设置回文本字段。如果单击继续或确定，则应保留新值。我已经尝试了很长时间，但无法保留旧值。
Eg: Before onchange, val in text field ='first'; onChange event, val changed to 'second', confirm window opens, if ok selected text field should have second and if cancel is selected 'first' should be present in the text field.
例如：onchange 之前，文本字段中的 val ='first'; onChange 事件，val 更改为“第二个”，确认窗口打开，如果确定，选择的文本字段应该有第二个，如果选择取消，文本字段中应该出现“第一个”。
function onChangeOfValue(input){
//var oldValue = document.getElementById(input).value;
document.getElementById(input).onchange = function(){
var newValue = this.value;
alert("newVal is--->"+newValue);
if(document.getElementById(input) != null && document.getElementById(input) != ''
&& !confirm("Do you want to continue?")){
// this.input=oldValue;
return false;
}
}
}
回答by RobG
Note that form controls have a defaultValueproperty that is the default value (surprisingly). You can use this property to store the previous value of the input, or to return the value to the previous value.
请注意，表单控件有一个defaultValue属性，它是默认值（令人惊讶）。您可以使用此属性来存储输入的前一个值，或者将值返回到前一个值。
So putting together the suggestions you've been given, the following function is passed a reference to the element and asks the user if they want to keep the current value. If they answer yes, then the defaultValueof the input is set to the current value. If the users says no (i.e. cancel), then the valueis reset to the defaultValue.
因此，将您得到的建议放在一起，下面的函数会传递对元素的引用，并询问用户是否要保留当前值。如果他们回答是，则输入的defaultValue设置为当前值。如果用户说不（即取消），则该值将重置为defaultValue。
Note that this approach will overwrite the original valueof the input, so if you reset the form, the input's valuewill be reset to the current defaultValue.
请注意，此方法将覆盖输入的原始值，因此如果您重置表单，输入的值将重置为当前的defaultValue。
<script>
function onChangeOfValue(element) {
var oldValue = element.defaultValue;
var newValue = element.value;
if (window.confirm('do you really want to change the value to ' + newValue + '?')) {
element.defaultValue = newValue;
} else {
element.value = element.defaultValue;
}
}
</script>
<input onchange="onChangeOfValue(this);">
This approach will work for any number of inputs in the same page and form.
这种方法适用于同一页面和表单中的任意数量的输入。
回答by Adam Rackis
I would use a closure to keep track of the last value:
我会使用闭包来跟踪最后一个值：
(function(){
var oldValue = document.getElementById(input).value;
document.getElementById(input).onchange = function(){
var newValue = this.value;
alert("newVal is--->"+newValue);
if(document.getElementById(input) != null
&& document.getElementById(input) != ''
&& !confirm("Do you want to continue?")){
this.value = oldValue;
return false;
} else {
oldValue = this.value;
}
};
})();
