හෆ්ෆා..යන්තං ඇති එක පේපරයක් ගොඩ දාගත්ත. ඒක ඉවර කොරල තකහනියක්ම බ්ලොග්ස්පොට් පැත්තෙ දුවගෙන ආවෙ ජේකුඅරි ගැන 2 වැනි ලිපිය ලියන්න කියල.. ආ.. කලින් එක කියවපු නැති කෙනෙක් ඉන්නවනං
මෙතන කෙටුවම ඒක බලාගන්න පුළුවන්.
හරි එහෙනං පටංගමු අද දවසෙ වැඩ : හොදයි... ජේකුඅරි අපේ පිටුවකට load කරගන්න විදිය අපි කලින් දවසෙ බැලුවනෙ...
$(document).ready()
ජේකුඅරි ඉගෙන ගැනීමේදී මුලින්ම ඉගෙන ගතයුතු වන්නේ මෙන්න මේ function එකයි. ඔබේ events (events ගැන ඉස්සරහට කතාකරමු) ඇතුලත් කළ යුතු වන්නේ මෙම function එක තුලටය.
$(document).ready(function(){
// ඔබේ ජේකුඅරි වැඩ කෑලි මෙහි ඇතුලත් කල හැක ;)
});
සමහර වෙලාවට මේක කෙටියෙන් ලියන්න මෙන්න මේ විදියත් පාවිච්චි කරනව ඒකෙත් වැරැද්දක් නෑ.
$(function(){
});
අපි එහෙනං පොඩි උදාහරනයක් බලමු.
මුලින්ම ඔබේ TextEditor එක අරගෙන මෙන්න මේ විදියට HTML පිටුවක් හදාගන්න.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<a href="http://crazykesh.blogspot.com">Click here</a>
</body>
</html>
මම මේකෙ කළේ HTML පිටුවට hyperlink එකක් එකතු කරපු එක දැන් බලමු ඒ ලින්ක් එක click කලාම ඒක ජේකුඅරි වලින් handle කරන විදිය.
$(function(){
$ ("a").click(function(event){
alert("you clicked.....");
event.preventDefault();
});
});
මේකෙදි වෙන්නෙ ඉහත hyperlink එකේ click event එකක් ඇතිවුන හැටියෙ මෙම function එක මගින් alert එකක් ලබා දීමයි. මෙහි preventDfeault() මගින් සිදු කරනුයේ hyperlink එකෙන් ලබාදී ඇති link එකට යාම වැළැක්වීමයි.
මෙම කේතය වෙනම .js file එකක් ලෙස save කර අදාල file නම script ටැගයක් ඇතුලේ ලබාදීම හෝ HTML පිටුවටම script ටැගයක් තුල ලබාදීම කළ හැක.
සම්පූර්ණ කේතය :
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$ ("a").click(function(event){
alert("you clicked.....");
event.preventDefault();
});
});
</script>
</head>
<body>
<a href="http://crazykesh.blogspot.com">Click here</a>
</body>
</html>
CSS වල වැඩ ටිකක් ගැන ඊළඟට කතාකරමු..............|
