JavaScript හි සිදුවීම් නියෝජනය
කලින් පාඩමේදී ගැටළුව විස්තර කර තිබුණි, නව මූලද්රව්ය එකතු කිරීමේදී පැනනගින, එහි විසඳුම ද ඉදිරිපත් කර ඇත. මෙම පාඩමේදී අපි ගැටළුව ඉක්මවා යාමට වඩා හොඳ ක්රමයක් සලකා බලමු - සිදුවීම් නියෝජනය. අපි එය විග්රහ කරමු.
ඔබ දැනටමත් දන්නා පරිදි, li මත ක්ලික් කිරීමෙන්, අපි
එකවරම ul මත ද ක්ලික් කරමු. මෙය
හැකි වන්නේ සිදුවීම් උත්ප්ලවනය හේතුවෙනි. අපිට
අපගේ කාර්යය විසඳීම සඳහා මෙය භාවිතා කළ හැකිය:
සිදුවීම් එක් එක් li මත අලවනවා වෙනුවට,
ඒවායේ මාපිය ul මත අලවමු:
list.addEventListener('click', function() {
});
දැන් සිදුවීම් පෙරළිකරුවේ this
පෙරළිකරුව බැඳී ඇති මූලද්රව්යයට යොමු කරයි,
සහ event.target - සිදුවීම සිදු වූ මූලද්රව්යයට
යොමු කරයි:
list.addEventListener('click', function(event) {
console.log(this); // අපගේ ලැයිස්තුව
console.log(event.target); // ලැයිස්තු අයිතමය
});
අපි li මත ක්ලික් කිරීම සිදු වූ පසු,
එහි අවසානයට හර්ෂක සලකුණු එකතු වන පරිදි කරමු:
list.addEventListener('click', function(event) {
event.target.textContent = event.target.textContent + '!';
});
ඉහත දක්වා ඇති විසඳුම නැවත කරන්න. ඔබට විශ්වාස කරන්න,
නව li මූලද්රව්ය ද ක්ලික් කිරීමට ප්රතිචාර දක්වනු ඇත.