วิธีรับค่าเก่าด้วยเหตุการณ์ onchange () ในกล่องข้อความ

Question 1

ฉันมีกล่องข้อความและค่าที่สร้างขึ้นเมื่อโหลดหน้าเว็บ ตอนนี้ถ้าผู้ใช้เปลี่ยนสิ่งใด ๆ ในกล่องข้อความฉันต้องการรับค่าที่เปลี่ยนแปลง (ค่าใหม่) และค่าเก่า แต่เมื่อฉันทำ 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>

ขอบคุณล่วงหน้า

Question 2

element.defaultValue จะให้ค่าดั้งเดิมแก่คุณ

โปรดทราบว่าสิ่งนี้ใช้ได้กับค่าเริ่มต้นเท่านั้น

หากคุณต้องการสิ่งนี้เพื่อคงค่า "เก่า" ทุกครั้งที่มีการเปลี่ยนแปลงคุณสมบัติ expando หรือวิธีการที่คล้ายกันจะตอบสนองความต้องการของคุณ

Question 3

คุณจะต้องจัดเก็บค่าเก่าด้วยตนเอง คุณสามารถจัดเก็บได้หลายวิธี คุณสามารถใช้ออบเจ็กต์จาวาสคริปต์เพื่อเก็บค่าสำหรับแต่ละกล่องข้อความหรือคุณอาจใช้ฟิลด์ที่ซ่อนอยู่ (ฉันไม่แนะนำ - 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>

Question 4

ฉันจะแนะนำ:

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

  //we have available old value here;
}

Question 5

คุณควรใช้แอตทริบิวต์ข้อมูล HTML5 คุณสามารถสร้างแอตทริบิวต์ของคุณเองและบันทึกค่าต่างๆไว้ในนั้นได้

Question 6

เคล็ดลับสกปรกที่ฉันใช้บ่อยครั้งคือการซ่อนตัวแปรในแอตทริบิวต์ "name" (ซึ่งโดยปกติฉันไม่ได้ใช้เพื่อวัตถุประสงค์อื่น):

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

ค่อนข้างไม่คาดคิดทั้งค่าเก่าและใหม่จะถูกส่งไปยัง someFunction(oldValue,newValue)

Question 7

ฉันไม่แน่ใจ แต่บางทีตรรกะนี้อาจใช้ได้

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

Question 8

คุณสามารถทำได้: เพิ่มแอตทริบิวต์ oldvalue ให้กับองค์ประกอบ html เพิ่มชุด 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>

Question 9

บางทีคุณอาจเก็บค่าก่อนหน้าของกล่องข้อความลงในกล่องข้อความที่ซ่อนไว้ จากนั้นคุณจะได้รับค่าแรกจากการซ่อนและค่าสุดท้ายจากกล่องข้อความเอง อีกทางเลือกหนึ่งที่เกี่ยวข้องกับสิ่งนี้ที่เหตุการณ์ออนโฟกัสของกล่องข้อความของคุณตั้งค่าของกล่องข้อความของคุณเป็นฟิลด์ที่ซ่อนอยู่และในเหตุการณ์ onchange อ่านค่าก่อนหน้า

Question 10

บางทีคุณอาจลองบันทึกค่าเก่าด้วยเหตุการณ์ "ออนโฟกัส" เพื่อเปรียบเทียบกับค่าใหม่กับเหตุการณ์ "onchange" ในภายหลัง