เหตุการณ์ครั้งเดียวใน jQuery

เมื่อเราศึกษาการถอดการเชื่อมโยงเหตุการณ์ด้วย ความช่วยเหลือของเมธอด off, เราได้ใช้โครงสร้างต่อไปนี้:

javascript$('li').on('click', function() {
  $(this).append('!');
  $(this).off('click', func);
});

ขั้นแรกเราแนบฟังก์ชันตัวจัดการด้วย ความช่วยเหลือของ on, จากนั้นถอดการเชื่อมโยงด้วยความช่วยเหลือของ off

ใน jQuery มีเมธอดที่สะดวกคือ one, ซึ่งอนุญาตให้เชื่อมโยงเหตุการณ์ครั้งเดียว - มันจะทำงานเพียงครั้งเดียวเท่านั้น จากนั้น จะถอดการเชื่อมโยงอัตโนมัติ เมธอดนี้ รับพารามิเตอร์แรกเป็นประเภทของเหตุการณ์ และพารามิเตอร์ที่สองเป็นฟังก์ชันที่เชื่อมโยง

ตัวอย่างต่อไปเราจะพิจารณาจากโค้ด HTML ด้านล่างนี้:

html<ul>
  <li>text</li>
  <li>text</li>
  <li>text</li>
</ul>

โค้ด CSS มีลักษณะดังนี้:

cssli {
  width: 100px;
  cursor: pointer;
}

ตอนนี้เราจะเชื่อมโยงเหตุการณ์ครั้งเดียว กับแต่ละ li:

javascript$('li').one('click', function() {
  $(this).append('!');
});

กรุณาคลิกที่รายการ ในลิสต์ อย่างที่คุณเห็น เราได้เอฟเฟกต์เดียวกัน ต้องขอบคุณ เมธอด one