มีโปรเจ็กต์ที่กล่องอินพุตตรวจสอบอินพุตแบบเรียลไทม์และทริกเกอร์คำขอ
แนวคิดแรกคือการใช้เมธอด onchange() กับอินพุต ฉันลองแล้ว แต่มันไม่ทำงาน มันจะถูกทริกเกอร์หลังจากยืนยันการเปลี่ยนแปลงค่าแล้วเท่านั้น ซึ่งไม่ได้เกิดขึ้นในทันที
ฉันตรวจสอบออนไลน์แล้ว
$(#fix).on('input propertychange', function(event){});วิธีการนี้ใช้งานได้ แต่การเปลี่ยนแปลงแบบเรียลไทม์ ความถี่ในการส่งค่อนข้างเร็ว
รีบเพิ่มตัวจับเวลา setTimeout
$(#fix).on('input propertychange', function(event){ setTimeout(function(){ //Delay 0.5s to Execution console.log($(#fix).val()) },500); } );ปัญหาเกิดขึ้นอีกครั้ง ตัวจับเวลาเป็นแบบอะซิงโครนัส แม้ว่าจะล่าช้า แต่ก็จะยังคงดำเนินการโดยไม่มีการเปลี่ยนแปลงใดๆ
ต่อมา ฉันคิดที่จะแยกและผูก แต่ไม่สามารถรับเหตุการณ์การป้อนข้อมูลด้วยแป้นพิมพ์ได้ในช่วงเวลาที่แยกออก
แนวคิดแรกในขณะนั้นคือการทริกเกอร์เหตุการณ์ - ลบตัวจับเวลา - เพิ่มตัวจับเวลา - ดำเนินการฟังก์ชัน ฉันพบว่ามันยังไม่ดีและไม่สามารถลบตัวจับเวลาได้ ฉันก็เลยหยุดดำเนินการไป
ในที่สุดฉันก็ตรวจสอบออนไลน์และพบวิธีการใหม่
วิธีการประทับเวลา
หลักการคือในแต่ละครั้งที่มีการแก้ไขตัวแปรร่วมและการประทับเวลาโดยอินพุต การประทับเวลาใหม่จะถูกตรวจสอบด้วยความล่าช้า 0.5 วินาที และเท่ากับการประทับเวลาที่ถูกผูกไว้ จากนั้นดำเนินการขั้นตอนต่อไป
-----html-----
<input type=text id=fix>------script-----var Last;$(#fix).on('input propertychange', function(event){ //#fix เป็นของคุณ input Box Last = event.timeStamp; //ใช้การประทับเวลาของเหตุการณ์เพื่อทำเครื่องหมายเวลา เพื่อให้แต่ละเหตุการณ์แก้ไขค่าของ Last โปรดทราบว่าสุดท้ายจะต้องเป็นตัวแปรส่วนกลาง setTimeout(function() {//ตั้งค่าการหน่วงเวลาเป็น 0.5 s เพื่อดำเนินการ if(last -event.timeStamp==0) //หากเวลาต่างกันเป็น 0 (นั่นคือ ไม่มีเหตุการณ์การกดคีย์อื่นเกิดขึ้นภายใน 0.5 วินาทีหลังจากที่คุณหยุดพิมพ์) ให้ทำสิ่งที่คุณต้องการทำ { console.log($(#fix).val()) } } , 500);}); สรุปข้างต้นคือการตรวจจับอินพุต HTML5 แบบเรียลไทม์และการเพิ่มประสิทธิภาพการหน่วงเวลาที่แนะนำโดยตัวแก้ไข ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉัน แล้วตัวแก้ไขจะตอบกลับคุณทันเวลา ฉันอยากจะขอบคุณทุกคนที่ให้การสนับสนุนเว็บไซต์ศิลปะการต่อสู้ VeVb!