JQuery සිංහලෙන් – 2

Share with your friends!

ගොඩක් දවසකට පස්සේ තමයි මේ post series එකේ දෙවැනි post එක ලියන්නේ. කලින් post එකේ කිව්ව විදියට මේ post එකේදී කියන්න යන්නේ jquery events ගැන. කලින් post එක බැලුවේ නැත්තන් මෙතැනින් බලන්න.

Jquery Events වලදී විස්තර වෙන්නේ browser එකේදි කරන Interaction නිසා ඇති වෙන events ගැන. මේවා කොටස් 4කට වෙන් කරන්න පුළුවන්.

1. Mouse Events
2. Keyboard Events
3. Form Events
4. Document/Window Events

දැන් බලමු මේවා එකින් එක මොනවද මේවා වල විස්තර වෙන්නේ කියලා.

Mouse Events

• click – Single click event
• dblclick – Double click event
• mouseenter – Mouse enter event
• mouseleave – Mouse leave event

Keyboard Events

• keypress – Key Press event
• keydown – Key down event
• keyup – Key release event

Form Events

• submit – form submit event
• change – form element change event
• focus – form element focus / select event
• blur – form element blur/ deselect event

Document/Window Event

• load – page load event
• resize – window resize event
• scroll – page scroll event

දැන් බලමු මේ events use කරන්නේ කොහොමද කියලා.

කලින් post එකේදී විස්තර කරපු විදියට code structure එකට අනුව බලමු events use කරන්නේ කොහොමද කියලා.

[code language=”javascript”]
$(document).ready(function(){
$("button").event(function(){
$("p").hide();
});
});
[/code]

මේ event එක වෙනුවට කලින් කතා කරපු events use කරන්න පුළුවන් අපේ development එකට ගැලපෙන විදියට. මේ තියෙන්නේ Jquery Events වල main events වලට අදාළ working example එක.

මේ විදියට අමතරව single element එකකට අදාලව events කීපයක් trigger වෙනවා නම් මේ විදියට ලියන්නත් පුළුවන්.

[code language=”javascript”]
$("p").on({
mouseenter: function(){
alert("Mouse Enter");
},
mouseleave: function(){
alert("Mouse leave");
},
click: function(){
alert("Mouse click");
}
});
[/code]

function scope එකේ implementation එක කැමති විදියකට හදාගන්න පුළුවන්.

මීළඟ පොස්ට් එකේ effects විස්තර කරන්නම්. පැහැදිලි නැති දෙයක් තියනවා නම් Comment කරලා අහන්න. ලිපිය ගැන අදහසක් දුන්නොත් තව හොඳට tutorial එක කරන්න පුළුවන්.

Share with your friends!