অন্ এবং ওয়ান ইভেন্ট হ্যান্ডলার (on & one Event Handler) : জে-কোয়েরী -(পর্ব-৪১)

অন্ ইভেন্ট হ্যান্ডলার (on Event Handler) : jQuery on event handler এর সাহায্যে কোন element এর সাথে এক বা একাধিক event কে attach করা যায়। এ event handler টি jQuery 1.7 এর নতুন সংযোগ। একে সমন্বয়ক event handler ও বলা য়েতে পারে; কারন এর মাধ্যমে পুরাতন event handler যেমন : bind(), live() এবং delegate() এ সব গুলি এর কাজ করানো সম্ভব। আমরা যদি jQuery 1.7.1 এর source code এর দিকে তাকাই তাহলে দেখব য়ে পুরাতন সকল event handler -ই .on() methode কে ব্যবহার করেছে।

jquery-1.7.1.js এর source code এর কিছু অংশ :
[sourcecode language=”js”]
// … more code …

bind: function( types, data, fn ) {
return this.on( types, null, data, fn );
},
unbind: function( types, fn ) {
return this.off( types, null, fn );
},
live: function( types, data, fn ) {
jQuery( this.context ).on( types, this.selector, data, fn );
return this;
},
die: function( types, fn ) {
jQuery( this.context ).off( types, this.selector || "**", fn );
return this;
},
delegate: function( selector, types, data, fn ) {
return this.on( types, selector, data, fn );
},
undelegate: function( selector, types, fn ) {
return arguments.length == 1 ?
this.off( selector, "**" ):
this.off( types, selector, fn );
},

// … more code …
[/sourcecode]

নিম্নে পুরাতন event handler এর সাথে এর(.on() methode এর) কিছু equivalent code দেখান হল:

[sourcecode language=”js”]
/* The jQuery .bind(), .live(), and .delegate() methods are just one
line pass throughs to the new jQuery 1.7 .on() method */

// Bind
$( "#members li a" ).on( "click", function( e ) {} );
$( "#members li a" ).bind( "click", function( e ) {} );

// Live
$( document ).on( "click", "#members li a", function( e ) {} );
$( "#members li a" ).live( "click", function( e ) {} );

// Delegate
$( "#members" ).on( "click", "li a", function( e ) {} );
$( "#members" ).delegate( "li a", "click", function( e ) {} );
[/sourcecode]

ওয়ান ইভেন্ট হ্যান্ডলার (one Event Handler) : এটিও on() event handler এর মত element এর সাথে event কে attach করে। কিন্তু পার্থক্য হল এটি প্রতিটি element এর জন্য শুধু মাত্র এক বার করে execute হবে(only be triggered once per element)। ধরুন আপনি click event কে কোন button এর সাথে .one() event handler এর মাধ্যমে attach করিয়েছেন তাহলে button টি শুধু মাত্র প্রথম click কে-ই কাজ করবে, এর পর আর যত click করবেন click event কাজ করবেনা।

………………………………………………………………………………
আলোকিত একটা সুন্দর সমৃদ্ধ পৃথিবী আমাদের প্রত্যেকেরই স্বপ্ন । আসুন আমাদের মেধা পরিশ্রম কে বিজ্ঞান সম্মতভাবে ব্যবহার করে, আমাদের স্বপ্ন পূরণে অংশ গ্রহণ করি। আজ এখানেই শেষ করছি। সকলের জন্য শুভকামনা রইল। “HAVE A GOOD PROGRAMMING”