ដើម្បីដោះស្រាយបញ្ហាខាងលើនេះ ក្រុមអ្នកឯកទេសភាសា JS បានបង្កើតវិធីចំួនពីរគឺវិធី addEventListener() សំរាប់បង្កើតហេតុការណ៍ចេញពីធាតុ HTML និងភ្ជាប់ហេតុការណ៍ទៅនឹងក្បួនឬវិធីឆ្លើយតបហេតុការណ៍ទាំងឡាយ។ ចំណែកឯវិធីឈ្មោះ removeEventListener() វិញ ត្រូវប្រើប្រាស់សំរាប់លុបហេតុការណ៍ចេញពីធាតុ HTML ។
សរុបមក យើងមានមធ្យោបាយពីរក្នុងការបង្កើតហេតុការណ៍ onclick ចេញពីធាតុ HTML ណាមួយ - មធ្យោបាយទីមួយ គឺប្រើប្រាស់សម្បត្តិ onclick របស់ធាតុ HTML មធ្យោបាយទីពីរ គឺប្រើប្រាស់វិធីមានស្រាប់ឈ្មោះ addEventListener() ។ ពិនិត្យកម្មវិធីខាងក្រោមនេះ៖
<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Odor+Mean+Chey' rel='stylesheet'>
</head>
<body style="font:14px/1.5 'Odor Mean Chey'">
<input id="ch-color" type="button" value="ប៊ូតុងចុច" />
<input type="color" id="favcolor" value="#ff0000">
<script>
function myFunction(){
var color = document.getElementById("favcolor").value;
document.getElementsByTagName("body")[0].style.backgroundColor = color;
}
var btn = document.getElementById("ch-color");
btn.addEventListener("click", myFunction);
</script>
</body>
</html>
នៅក្នុងកម្មវិធីខាងលើនេះ នៅលើបន្ទាត់លេខ 16 យើងសង្កេតឃើញថា ហេតុការណ៍ click ឬ onclick ត្រូវបានបន្ថែមចូលទៅក្នុងប៊ូតុងចុចមានអត្តសញ្ញាណជា "ch-color" ហើយក្បួនឈ្មោះ myFunction ក៏ត្រូវបានភ្ជាប់ទៅនឹងហេតុការណ៍ឈ្មោះ click នោះដែរ។ ជាលទ្ធផល បើយើងចុចប៊ូតុងនោះ ពណ៌របស់ផ្ទៃ browser នឹងដូរទៅតាមពណ៌ដែលត្រូវបានជ្រើសរើសនៅលើប៊ូតុងរើសពណ៌។ មួយវិញទៀត បើសិនជាយើងចង់លុបហេតុការណ៍ click នោះចេញពីប៊ូតុងចុចនោះវិញ យើងត្រូវធ្វើដូចគ្នា គ្រាន់តែប្រើប្រាស់វិធីឈ្មោះ removeEventListener ជំនួសអោយវិធី addEventListener គឺជាការស្រេច៕
