[javascript] 텍스트 상자에서 onchange () 이벤트로 이전 값을 얻는 방법

Program / 글쓴이

페이지가로드 될 때 텍스트 상자와 값이 채워져 있습니다. 이제 사용자가 텍스트 상자에서 어떤 것을 변경하면 변경된 값 (새 값)과 이전 값을 얻고 싶지만 ELEMENT.value를 수행하면 변경된 값만 제공됩니다.

오래된 가치를 얻기위한 제안?

아래는 내 코드입니다 

<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>

미리 감사드립니다

답변

element.defaultValue 당신에게 원래의 가치를 줄 것입니다.

이것은 초기 값에서만 작동합니다.

변경 될 때마다 “이전”값을 유지하기 위해이 값이 필요한 경우 expando 속성 또는 유사한 방법이 요구 사항을 충족합니다.

답변

이전 값을 수동으로 저장해야합니다. 다양한 방법으로 저장할 수 있습니다. 자바 스크립트 객체를 사용하여 각 텍스트 상자에 대한 값을 저장하거나 숨겨진 필드를 사용할 수 있습니다 (권장하지 않습니다-너무 html 무거움). 또는 다음과 같이 텍스트 상자 자체에 expando 속성을 사용할 수 있습니다.

<input type="text" onfocus="this.oldvalue = this.value;" onchange="onChangeTest(this);this.oldvalue = this.value;" />

그런 다음 변경 사항을 처리하는 자바 스크립트 함수는 다음과 같습니다.

    <script type="text/javascript">
    function onChangeTest(textbox) {
        alert("Value is " + textbox.value + "\n" + "Old Value is " + textbox.oldvalue);
    }
    </script>

답변

내가 제안 할게:

function onChange(field){
  field.old=field.recent;
  field.recent=field.value;

  //we have available old value here;
}

답변

HTML5 데이터 속성을 사용해야합니다. 자신 만의 속성을 만들고 그 안에 다른 값을 저장할 수 있습니다.

답변

내가 가끔 사용하는 더러운 속임수는 ‘name’속성에 변수를 숨기는 것입니다 (일반적으로 다른 용도로 사용하지 않음). 

select onFocus=(this.name=this.value) onChange=someFunction(this.name,this.value)><option...

예기치 않게 이전 값과 새 값이 모두 제출됩니다. someFunction(oldValue,newValue)

답변

확실하지는 않지만이 논리가 작동 할 수도 있습니다.

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);
*/

답변

당신은 이것을 할 수 있습니다 : html 요소에 oldvalue 속성을 추가하고 사용자가 클릭 할 때 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>