رویدادjQuery

صفحه قبل انتخاب‌گرjQuery
صفحه بعدی jQuery مخفی‌سازی/نمایش

jQuery برای مدیریت رویدادها به ویژه طراحی شده است.

توابع رویداد jQuery

توابع مدیریت رویداد jQuery یکی از توابع هسته‌ای jQuery هستند.

برنامه‌های مدیریت رویداد روش‌هایی هستند که هنگام رخ دادن برخی رویدادها در HTML فراخوانی می‌شوند. اصطلاحی که اغلب برای فعال شدن رویدادها از آن استفاده می‌شود، "اشتعال" (triggered) یا "برانگیخته شدن" است.

معمولاً کد jQuery را در بخش <head> روش‌های مدیریت رویداد قرار می‌دهند:

مثال

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});
</script>
</head>
<body>
<h2>این یک عنوان است</h2>
<p>این یک پاراگراف است.</p>
<p>این یک پاراگراف دیگر است.</p>
<button>کلیک کنید</button>
</body>
</html>

شما خودتان امتحان کنید

در مثال بالا، زمانی که رویداد کلیک روی دکمه فعال می‌شود، یک تابع فراخوانی می‌شود:

$("button").click(function() {  // some code... } )

این روش تمام عناصر <p> را مخفی می‌کند:

$("p").hide();

توابع در فایل جداگانه

اگر وب‌سایت شما شامل تعداد زیادی صفحه است و می‌خواهید تابع jQuery شما راحت قابل نگهداری باشد، لطفاً توابع jQuery خود را در یک فایل مستقل .js قرار دهید.

وقتی که ما jQuery را در آموزش‌ها نمایش می‌دهیم، وظایف را مستقیماً به بخش <head> اضافه می‌کنیم. اما قرار دادن آن‌ها در یک فایل جداگانه بهتر است، مانند این (از طریق ویژگی src به فایل اشاره می‌کنیم):

مثال

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="my_jquery_functions.js"></script>
</head>

تضاد نام jQuery

jQuery از نماد $ به عنوان روش معرفی خود استفاده می‌کند.

وظایف برخی از کتابخانه‌های دیگر JavaScript (مثل Prototype) نیز از نماد $ استفاده می‌کنند.

jQuery از روش noConflict() برای حل این مشکل استفاده می‌کند.

var jq=jQuery.noConflict()، که به شما کمک می‌کند تا از نام‌های خود (مثلاً jq) به جای نماد $ استفاده کنید.

شما خودتان امتحان کنید

نتیجه‌گیری

چون jQuery برای مدیریت رویداد‌های HTML طراحی شده است، بنابراین اگر از اصول زیر پیروی کنید، کد شما مناسب‌تر و قابل نگهداری‌تر خواهد بود:

همه‌ی کد‌های jQuery را در متد مدیریت رویداد قرار دهید
همه‌ی متد‌های مدیریت رویداد را در رویداد آماده‌سازی مستند قرار دهید
کد jQuery را در یک فایل جداگانه .js قرار دهید
در صورت وجود تضاد نام، نام jQuery کتابخانه را تغییر دهید