5

我有一个文本字段，我从中调用onChange事件函数。当该文本字段中的值发生更改时，我将在此处抛出一个确认窗口。如果单击取消（在确认窗口中），则必须将旧值设置回文本字段。如果单击继续或确定，则应保留新值。我已经尝试了很长时间，但无法保留旧值。

例如：在 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;
    }
    }

}
4

2 回答 2

16

请注意，表单控件有一个defaultValue属性，它是默认值（令人惊讶）。您可以使用此属性存储输入的先前值，或将值返回到先前值。

因此，将您给出的建议放在一起，以下函数将传递一个对元素的引用，并询问用户是否要保留当前值。如果他们回答是，则输入的defaultValue设置为当前值。如果用户说不（即取消），则将该值重置为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);">

这种方法适用于同一页面和表单中的任意数量的输入。

于 2013-06-05T05:18:02.580 回答
6

我会使用闭包来跟踪最后一个值：

(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;
        }
    };
})();
于 2013-06-05T04:44:02.453 回答