مارس 3, 2019 Mostafa بدون دیدگاه

اگر دنبال برنامه نویس برای ساخت افزونه ،قالب،سایت،برنامه ویندوز،اپلیکیشین اندروید،ربات تلگرام و.... هستید ،سفارش برنامه نویسی را مطالعه نمایید.

توجه : درخواست افزونه ،قالب، اسکریپت و نرم افزار و ... و سوالات و مشکلات خود را در انجمن ارسال نمایید

رویداد mouseleave در jQuery

در این بخش از آموزش JQuery ، رویداد mouseleave را  در طراحی سایت شرح میدهیم.

رویداد mouseleave زمانی اتفاق می افتد که  اشاره گر ماوس محتوای تگ html ترک می کند .
شکل کلی استفاده از این متد به شرح زیر است :

    $(selector).mouseleave(function)

مثال زیر کاربرد رویداد mouseleave را نشان میدهد.

    $("#p1").mouseleave(function(){
    alert("Bye! You now leave p1!");
    });

رویداد ( ) mousedown در jQuery

در این بخش از آموزش JQuery ، رویداد mousedown را در طراحی سایت  شرح میدهیم.

رویداد mousedown زمانی اتفاق می افتد که دکمه سمت چپ موس را بر روی عنصر مورد نظر فشار دهید .
رویداد mousedown می تواند دو کار را انجام دهد :

۱- باعث رخ دادن رویداد mousedown برای عنصر مورد نظر می شود . شکل استفاده از این حالت به صورت زیر است :

    $ ( " selector " ).mousedown ( ) ;

۲- باعث اجرا شدن تابع یا دستوری در هنگام فشرده شده دکمه موس بر روی عنصر مورد نظر می شود . شکل استفاده از این حالت به صورت زیر است :

    $ ( " selector " ).mousedown ( functoin ) ;

مثال زیر کاربرد رویداد mousedown را نشان میدهد :

    $("#p1").mousedown(function(){
    alert("Mouse down over p1!");
    });

زمانیکه دکمه ماوس روی عنصر مورد نظر فشرده می شود.
رویداد ( ) mouseup در jQuery

در این بخش از آموزش JQuery ، رویداد mouseup را  در طراحی سایت شرح میدهیم.

رویداد mouseup زمانی اتفاق می افتد که دکمه فشرده شده موس را بر روی عنصر مورد نظر ، رها دهید .
رویداد mouseup می تواند دو کار را انجام دهد :

۱ – باعث رخ دادن رویداد mouseup برای عنصر مورد نظر می شود . شکل استفاده از این حالت به صورت زیر است :

    $ ( " selector " ).mouseup ( ) ;

۲ – باعث اجرا شدن تابع یا دستوری در هنگام فشرده شدن دکمه موس بر روی عنصر مورد نظر و پس از رها کردن آن می شود . شکل استفاده از این حالت به صورت زیر است :

    $ ( " selector " ).mouseup ( functoin ) ;

مثال زیر کاربرد رویداد mouseup را نشان میدهد :

    $("#p1").mouseup(function(){
    alert("Mouse up over p1!");
    });

زمانیکه دکمه ماوس روی عنصر مورد نظر رها می شود
رویداد ( ) hover در jQuery

در این بخش از آموزش JQuery ، رویداد hover را در طراحی سایت  شرح میدهیم.

رویداد ( ) hover ، دو تابع را تعیین می کند که در هنگام عبور موس از روی عنصر مورد نظر ، اجرا می شوند . تابع اول در هنگام ورود موس بر روی عنصر و تابع دوم در هنگام خروح عنصر از روی عنصر اجرا می شود .
این رویداد هر دو رویداد mouseenter و رویداد mouseleave را فعال می کند .
شکل کلی استفاده از این متد به شرح زیر است :

    $ ( " selector " ).hover ( inFunction , outFunction ) ;

selector : selector ، تعیین کننده id عنصری است که می خواهیم رویداد ( ) hover در هنگام عبور از روی آن اتفاق بیفتد .

inFunction : این تابع زمانی اتفاق می افتد که رویداد mouseenter رخ می دهد . یعنی زمانی که موس بر روی عنصر مورد نظر وارد می شود .
outFunction : این تابع زمانی اتفاق می افتد که رویداد mouseleave رخ می دهد . یعنی زمانی که موس از روی عنصر مورد نظر خارج می شود .
نکته مهم : اگر فقط یک تابع در دستور رویداد ( ) hover تعیین شود ، این تابع برای هر رویداد اجرا می شود .

   $("#p1").hover(function(){
           alert("You entered p1!");
    },
    function(){
           alert("Bye! You now leave p1!");
    });

این رویداد دو function دارد . و این دو ترکیبی از رویدادهای mouseenter(), mouseleave() هستند . اولین تابع زمانیکه ماوی وارد عنصر html می شود اجرا می شود و دومین تابع زمانیکه اشاره گر عنصر را ترک می کند .

مثال زیر کاربرد رویداد hover را نشان میدهد :

   $("#p1").hover(function(){
           alert("You entered p1!");
    },
    function(){
           alert("Bye! You now leave p1!");
    });

رویداد ( ) focus در jQuery

در این بخش از آموزش JQuery ، رویداد focus را در طراحی سایت  شرح میدهیم.

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

    $ ( " selector " ).focus ( function ( ) { ... some code ... } ;

selector : selector کنترل یا عنصری است که فوکوس برنامه را به دست می آورد .
function : این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود .

مثال زیر کاربرد رویداد focus را نشان میدهد :

 $("input").focus(function(){
    $(this).css("background-color","#cccccc");
    });

زمانیکه عنصری از یک فرم فاکوس را در اختیار می گیرد این رویداد اجرا می شود

رویداد ( ) blur در jQuery

در این بخش از آموزش JQuery ، رویداد blur را در طراحی سایت  شرح میدهیم.

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

شکل کلی استفاده از این متد به شرح زیر است :

    $ ( " selector " ).focus ( function ( ) { ... some code ... } ;

selector : selector عنصر مورد نظری است که فوکوس برنامه را از دست می دهد . مثل یک کادر ورود متن که پس از پرکردن آن توسط کاربر و کلیک بر روی چیزی دیگر ، فوکوس را از دست می دهد .

function : این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود .

مثال زیر کاربرد رویداد blur را نشان میدهد :

   $("input").blur(function(){
    $(this).css("background-color","#ffffff");
    });

زمانیکه عنصرمورد نظر از فرم فاکوس را از دست می دهد
رویداد ( ) change در jQuery

در این بخش از آموزش JQuery ، رویداد change را در طراحی سایت  شرح میدهیم.

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

    $ ( " selector " ).change ( function ( ) { ... some code ... } ;

selector : selector کنترلی است که کاربر آن را تغییر می دهد .
function : این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود .

مثال زیر کاربرد رویداد change را نشان میدهد :

    $("input").change(function(){
    alert("The text has been changed.");
    });

این رویداد فقط برای عناصر درون فرم کاربرد دارد و زمانی فراخوانی می شود که محتوای یک عنصر تغییر کند.

رویداد ( ) submit در jQuery

در این بخش از آموزش JQuery ، رویداد submit را در طراحی سایت  شرح میدهیم.

رویداد ( ) submit زمانی اتفاق می افتد که یک فرم submit شده و به سرور ارسال شود .
برای مثال از رویداد ( ) submit می توان برای صدور یک پیام هشدار به کاربر ، برای اعلام submit شدن فرم استفاده کرد . رویداد ( ) submit فقط با تگ form کار می کند .
شکل کلی استفاده از این متد به شرح زیر است :

    Syntax $ ( " selector " ).submit ( ) ;

 

یا

    $ ( " selector " ).submit ( function ) ;

selector : این پارامتر تعیین کننده id فرمی است که submit شده است .
function : تعیین کننده تابعی است که می خواهیم پس از submit شدن فرم ، اجرا شود .

مثال زیر کاربرد رویداد ( ) submit را نشان میدهد :

    $("form").submit(function(){
    alert("Submitted");
    });

برچسب ها