آیا می دانید دوره های آموزشی سون لرن از جامع ترین و کاربردی ترین آموزش های موجود در سطح وب فارسی است!

ترفندهای پیشرفته jQuery (قسمت 13)

1 854 ۳ مهر ۹۴

در این قسمت با ادامه ترفندهای پیشرفته jQuery در خدمت شما هستیم.
jquery trickshot

موضوع سوم : رویدادها

مدیریت ساده رویدادها در jQuery یکی از ویژگی هایی هست که jQuery رو به یکی از معروفترین کتابخانه های Javascript تبدیل کرده. هر برنامه ای متناسب با رویداد ها اعمال و رفتار مورد نظر شما رو انجام میده. در این بخش تعدادی ترفند و روش در اختیارتون قرار میگیره که میتونین با استفاده از اون زمانتون رو ذخیره کنید و مشکلاتتون رو حل کنید.

ترفند 25 : به عنصر html کلاس js رو نسبت بدین

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

یک ترفند در این زمینه وجود داره که میتونه کار رو برای شما ساده تر کنه و اون اینه که به عنصر html یک کلاس نسبت بدین. با استفاده از این کلاس و CSS شما میتونین عنصر ها رو بسته به نیاز خودتون مخفی کنید و یا نمایش بدید. یعنی کاری کنید که تا اون کلاس موجود نباشه عناصرتون مخفی باشه. زمانی که Javascript فعال باشه کلاس js اضافه میشه و شما میتونین با استفاده از این نشانه عنصر مورد نظرتون رو نمایش بدین.

کد HTML:

کد CSS:

کد JS:

شما با استفاده از این تکنیک میتونین به سادگی یک المنت رو مخفی کنید و یا اینکه استایل کل صفحه رو تغییر بدین.

ترفند 26 : برای المنتهایی که هنوز وجود ندارن ، رویداد تعریف کنید

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

کدهای HTML زیر رو در نظر بگیرید:

اول متغیری رو میسازیم و ul رو به اون نسبت میدیم:

بعد از اون یک رویداد کلیک با استفاده از متد on برای li هایی که درون این list هستن رو تعریف میکنیم:

اگر از این روش استفاده کنید ، اگر بعدا توسط Ajax یا ... li جدیدی به این list اضافه شد ، این رویداد برای اون نیز اجرا میشه.

دیدید که تونستیم با استفاده از متد on رویداد رو بهتر مدیریت کنیم.

امیدوارم از این مطلب خوشتون اومده باشه.

موفق و پیروز باشید

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها یک نظر ارسال شده است.

  • ‏‏
    MohamadHosein(۱۷ دی ۱۳۹۴)

    جالب بود این ترفند26 تشکر ، مخصوصاً اینکه برای کنترل هایی که بعد ایجاد میشه رویداد درنظر گرفته میشه جالب تر کرده بود قضیه رو.

  • ارسال دیدگاه

    ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

    :: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
    برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
    عضویت/ ورود سریع با :
    در حال اتصال ...

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram