চলুন jQuery শিখি [part-2]

saiful · **Joined:** Mon Mar 02, 2009 3:27 pm **Posts:** 14

আমি jQuery র যে উদাহরণ গুলো দেখাব তাতে আমি সম্পুর্ণ কোড দেখাব না।jQuery র কোড গুলো আপনাকে আবশ্যই <head> এর ভেতর <script> tag দিয়ে লেখতে হবে।
Javascript এ যারা window.onload() function নিয়ে কাজ করেছেন তারা হয়ত খেয়াল করেছেন, এর মাধ্যমে কল করা কোন ফাংশন তখনই execute হয় যখন page এর সব object ও content load হয় ।মানে হচ্ছে কোন image যদি কোন কারণে লোড না হতে পারে তাহলে আপনার onload() এর দ্বারা যে ফাংশন কল করা হয়েছে তা আর execute হবে না।jquery তে .ready() function অনেকটা onload এর মত।difference হল এটাতে কোন page এর dom object গুলো যদি jquery হাতে পায় তাহলেই সে তার কাজ শুরু করে দেয় ।আর dom কে আপনি html এর বড় ভাই-ই বলতে পারেন তাই এগুলো একটু তাড়াতাড়ি-ই load হয় ।কারন,আপনি যদি আমাকে বলেন,তাহলে আমি বলব একটি page এ h1 নামের কোন element থাকলে সেটা লোড হতে যদি কোন সমস্যা না হয় তাহলে dom load হতেও কোন সমস্যা হওয়ার কথা না।
আর একটা জিনিস হল ready() function টি আপনার যতবার দরকার ততবার-ই কল করতে পারবেন ।
মাঝে মাঝে $(document).ready() ; কে “ $(); “ দিয়ে replace করে shortcut-এ
$ (function(){ your code here });
লেখা হয়।
চলুন এখন jQuery function গুলোর দিকে নজর দেই
jQuery( html ) / $(html):

ধরুন আপনি চাচ্ছেন user কে তার action এর উপর depend করে কোন লেখা দেখাবেন,যেমন
<script>
$(document).ready(
function(){
$("<div><p>Hello</p></div>").appendTo("body");
}
);
</script>

এখনই কোন action define করলাম না বুঝার সুবিধার জন্য।এই কোডটি আপনার page এ একটা Hello লেখা দেখাবে।এখানে যা হল,তা হচ্ছে
আমরা $(এখানে html code লেখেছি) পরে তা appendeTo() দিয়ে html body তে add করেছি ।যদিও আপনি html source code দেখলে Hello লেখা খুজে পাবেন না। পরে action assign করলে আরও ভালো করে এ জিনিসটি বুঝবেন আর এর কাজটা দেখবেন কত মজার।
চলুন এটাতে একটা action assign করি
$("<div><p>Hello</p></div>").appendTo("body").click(function(){$(this).text(“jQuery”)});

এখানে আমি যা করতে চাচ্ছি তা হল Hello লেখাটিতে যখন কেউ click করবে তখন একটা function কাজ করুক,এবং ‘this’ means-><div><p>এর মধ্যেই</p></div>"jQuery লেখাটা দেখাও,যেখানে Hello লেখাটা আছে এবং আমরা এ কাজটি করছি .text() এর মাধ্যমে।দেখলেনত কত মজার।এভাবে আরও কিছুদুর এগুলে আপনি নিজেই user এর এক click এ পুরো page এর চেহারা বদলে দিতে পারবেন।এখানে text() এর কাজ নিয়ে আমরা পরে বিস্তারিত বলব।

আমি এই টিউটরিয়ালটা first টিউটরিয়ালটা-r সাথেই লিখেছিলাম। খালি copy-paste করার বাকি ছিল। করব করব বলে করা হয়ে উঠে নাই।আজ করে ফেললাম।

	It is currently Thu Jul 29, 2010 6:29 pm
Index • FAQ • Search

চলুন jQuery শিখি [part-2]

Who is online