jQuery හි සිදුවීම් බැඳීම

JavaScript සිදුවීම් ගොඩකටම ඊට අනුරූප jQuery ක්‍රමයක් ඇත. උදාහරණයක් ලෙස, අංග වලට ක්ලික් කිරීම මෙසේ අල්ලාගත හැකිය: $(selector).click(function).

පහත HTML කේතය සලකා බලමු:

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

ඒ සඳහා CSS ලියා ඇත:

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

ඕනෑම li එකක් මත ක්ලික් කළ විට හඬ නඟින සලකුණක් පෙන්වන ලෙස කරමු. ලැයිස්තුවේ අයිතම මත ක්ලික් කර බලන්න:

$('li').click(function() {
	alert('!');
});

බැඳුනු ශ්‍රිතය තුළ this ට ප්‍රවේශ විය හැක, එය සිදුවීම සිදු වූ අංගය වෙත යොමු වේ (අපගේ නඩුවේදී, ක්ලික් කරන ලද li වෙත). මෙම this JavaScript විලාසයෙන් භාවිතා කළ හැකිය, උදාහරණයක් ලෙස, this.innerHTML හෝ jQuery විලාසයෙන් - මේ සඳහා මෙම this $ හි ඔතා තැබිය යුතුය, මෙසේ: $(this).

HTML කේතය ගනිමු:

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

මෙම කේතය සඳහා පහත CSS විලාස ලියා ඇත:

li {
	width: 100px;
}
li:hover {
	color: red;
	cursor: pointer;
}

li මත ක්ලික් කළ විට එහි අවසානයට '!' එකතු වන ලෙස කරමු. ක්‍රියාකාරිත්වය පරීක්ෂා කිරීම සඳහා ලැයිස්තුවේ අයිතම මත ක්ලික් කරන්න:

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

ක්ලික් කළ විට සෑම li එකකටම එහි ආරම්භයේ '?' එකතු වන ලෙස කරන්න.

චින්දන ලබා දී ඇත. ක්ලික් කළ විට සෑම චින්දනයකම එහි අන්තර්ගතය පරිකථනය මත පෙන්වන ලෙස කරන්න.

සංඛ්‍යා සහිත චින්දන ලබා දී ඇත. චින්දනය මත ක්ලික් කළ විට එහි අඩංගු සංඛ්‍යාවේ වර්ගය එහි පෙනෙන්නට යුතුය.