ການຕິດຕາມ addEventListener() HTML DOM Document
- ບ່ອນໄກກັບຄືນ activeElement
- ບ່ອນໄກຕໍ່ໄປ adoptNode()
- ກັບຄືນອອກສະຖານທີ່ນິຍົມ HTML DOM Documents
ການອະທິບາຍແລະການນໍາໃຊ້
addEventListener()
ວິທີການຕິດຕັ້ງຜູ້ຄວບຄຸມການເລື່ອງໃຫ້ເອກະສານ
ຄວາມຄິດ
ຄູ່ມວນຊົນ 1
ສະເໜີ click ການເລື່ອງໃຫ້ເອກະສານ
document.addEventListener("click", myFunction); function myFunction() { document.getElementById("demo").innerHTML = "Hello World"; }
ຂອງຄຳເວົ້າທີ່ງາຍດາຍຫຼາຍ:
document.addEventListener("click", function(){ document.getElementById("demo").innerHTML = "Hello World"; });
ຕົວຢ່າງ 2
ທ່ານສາມາດເພີ່ມຜູ້ຮັບຕາມເຫດການຫຼາຍຊະນິດຫຼາຍກວ່າໜຶ່ງໃຫ້ແກ່ໂຕເອງ:
document.addEventListener("click", myFunction1); document.addEventListener("click", myFunction2);
ຕົວຢ່າງ 3
ທ່ານສາມາດເພີ່ມຫົວວິຢາທີ່ຫຼາຍຊະນິດຂຶ້ນ:
document.addEventListener("mouseover", myFunction); document.addEventListener("click", someOtherFunction); document.addEventListener("mouseout", someOtherFunction);
ຕົວຢ່າງ 4
ການສົ່ງມາການຈະລົງຂອງວິທີສາຍທີ່ມີພາກສານກັບ "ວິທີສາຍບໍ່ມີຊື່":
document.addEventListener("click", function() { myFunction(p1, p2); });
ຕົວຢ່າງ 5
ການປ່ຽນເງິນສະພາບຂອງແຜນຮູບ:
document.addEventListener("click", function(){ document.body.style.backgroundColor = "red"; });
ຕົວຢ່າງ 6
ການນຳໃຊ້ removeEventListener() ວິທີ:
// ການເພີ່ມຜູ້ຮັບຕາມເຫດການ document.addEventListener("mousemove", myFunction); // ຖອນຜູ້ຮັບຕາມເຫດການ document.removeEventListener("mousemove", myFunction);
ຂອງຄຳເວົ້າ
document.addEventListener(type, function, capture)
ພຽງພໍ
ພຽງພໍ | ອະທິບາຍ |
---|---|
type |
ສະຫຼຸບຄວາມຈໍາຕັດ。ຊື່ຫົວວິຢາຂອງເຫດການ。 ບໍ່ຂໍ້ສະເໜີຄວັກ "on"。 ບໍ່ຂໍ້ສະເໜີ "click" ແທນ "onclick"。 ທຸກໆຫົວວິຢາ HTML DOM 事件ທີ່ຢູ່ໃນບ່ອນດັ່ງລຽງ: |
function |
ສະຫຼຸບຄວາມຈໍາຕັດ。ຫົວວິຢາທີ່ດຳເນີນໃນເວລາທີ່ເຫດການເກີດຂຶ້ນ。 当事件发生时,将事件对象作为第一个参数传递给函数。 事件对象的类型取决于指定的事件。例如,"click" 事件属于 MouseEvent 对象。 |
capture |
可选(默认 = false)。
|
ຜົນກະທົບ
ບໍ່ມີ.
ລາຍການພື້ນຖານເຕັກນິກ
ກົນລະບົບນີ້ຈະເພີ່ມກົນລະບົບການກວດກາເຫດການບັນດາຄຳມູນຄໍາໃຫ້ມີການກວດກາເຫດການບັນດາຄຳມູນຄໍາບັນດາຄຳມູນຄໍາ. ຖ້າ capture ຖ້າຕັ້ງໃສ່ true, ມັນຈະຖືກສະໝັກງານງານເຫດການການກວດກາ. ຖ້າ capture ຖ້າຕັ້ງໃສ່ false, ມັນຈະຖືກສະໝັກງານງານເຫດການຄົນທຳມະດາ.
addEventListener()
ອາດຖືກເອິ້ນຫຼາຍຄັ້ງ. ຖ້າມີການສະໝັກງານກົນລະບົບການກວດກາເຫດການຫຼາຍຄັ້ງໃນວັດຖຸດຽວກັນຫຼັງຈາກການສະໝັກງານ, DOM ບໍ່ສາມາດກວດກາຈະນັ້ນ.
ຖ້າມີກົນລະບົບການກວດກາເຫດການບັນດາຄຳມູນຄໍາໃນອັນດັບດຽວກັນ capture ປະຈໍາຜູ້ນຳການພາຍໃນຂະແນນນັ້ນຈະຖືກທຳລາຍ. ຖ້າກຳລັງກວດກາເຫດການທີ່ມີການສະແດງໃນວັດຖຸບັນດາຄຳມູນຄໍາຈະບໍ່ມີການກະຕຸ້ນກົນລະບົບການກວດກາເຫດການບັນດາຄຳມູນຄໍາໃໝ່.
ຖ້າມີການສະໝັກງານ Node.cloneNode()
ກົນລະບົບຫຼື Document.importNode()
ກົນລະບົບທີ່ສື່ມວັດຖຸ Document Node ຈະບໍ່ສື່ມກົນລະບົບການກວດກາເຫດການທີ່ມີການສະແດງໃນໂຕກໃນຕົ້ນ.
ກົນລະບົບນີ້ຈະມີການສະແດງຢູ່ Document ແລະ Window Object ແລະຈະມີວິວັດທະນາການຄືກັນ.
ການສະໜັບສະໜູນບັນນາທິການ
document.addEventListener
ເປັນເລື່ອງສະໜາມ DOM Level 2 (2001).
ທຸກພາສາເວັບໄຊທັງໝົດແມ່ນໄດ້ຮັບການສະໜັບສະໜູນເທົ່ານັ້ນ:
Chrome | IE | Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
Chrome | IE | Edge | Firefox | Safari | Opera |
ການສະໜັບສະໜູນ | 9-11 | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ |
ລາຍການຂໍ້ມູນອື່ນໆ
ກົນລະບົບແບບບັນດາປະກອຢ
ກົນລະບົບ removeEventListener()
ກົນລະບົບແບບໂຕກແມ່ນ
ກົນລະບົບ removeEventListener()
ການສຶກສາ
- ບ່ອນໄກກັບຄືນ activeElement
- ບ່ອນໄກຕໍ່ໄປ adoptNode()
- ກັບຄືນອອກສະຖານທີ່ນິຍົມ HTML DOM Documents