Event ها در jquery

Event ها در jquery

 

به تمامی کارهای که یک کاربر انجام میدهد و یک صفحه وب میتواند به آنها پاسخ بگوید، Event یا واقعه میگوییم. یکی از کارهایی که جی کوئری به شکلی عالی از پس آن بر می آید، پاسخدهی به وقایع در صفحات HTML است. هر Event در واقع نماینده ی لحظه ای است که اتفاقی در صفحه به وقوع می پیوندد. مثلا :

  • ماوس روی عنصری قرار بگیرد
  • یک دکمه رادیویی انتخاب شود
  • روی عنصری کلیک شود
  • و …

 

آشنایی با Event های پر کاربرد جی کوئری

 

Click: این واقعه وقتی اتفاق می افتد که کاربر روی عنصر html مورد نظر شما کلیک کرده باشد. مثلا در مثال زیر، وقتی کاربر روی پاراگراف کلیک کند، پاراگراف محو خواهد شد :

$(“p”).click(function(){

    $(this).hide();

});

 

Mouseenter: واقعه ی mouseenter همانطور که از نامش هم پیداست، وقتی اجرا میشود که اشاره گر ماوس وارد عنصر HTML مورد نظر شما شده باشد. در مثال پایین وقتی ماوس وارد عنصری دارای آی دی p1 شود، به وی هشداری مبنی بر ورود به این محدوده نشان داده خواهد شد :

$(“#p1”).mouseenter(function(){

    alert(“به p1 خوش آمدید!”);

});

Hover: متد hover دو تابع جداگانه میپذیرد. اولین تابع وقتی اتفاق می افتد که ماوس وارد محدوده ی مورد نظر شود و دومین تابع وقتی اتفاق می افتد که ماوس محوطه را ترک کند :

$(“#p1”).hover(function(){

    alert(“وارد p1 شدید!”);

},

function(){

    alert(“خداحافط! شما p1 را ترک کردید!”);

});

Focus: این متد بر روی فیلد های یک فرم مورد استفاده قرار میگیرد. این واقعه وقتی اتفاق می افتد که یک فیلد مورد توجه قرار گرفته باشد. مثلا کاربر با کلیک کردن در فیلد جستجو، آن را فعال کرده باشد. در مثال زیر، پس از اتفاق افتادن واقعه focus، رنگ پس زمینه ی فیلد مورد نظر را تغییر میدهیم :

 

$(“input”).focus(function(){

    $(this).css(“background-color”, “#ACFF9D”);

});