illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید با دوره های آموزشی سون لرن می توانید از 0 تا 100 طراحی وب را در منزل فراگیرید!

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

1 691 ۳ مهر ۹۴

در این قسمت با ادامه ترفندهای پیشرفته 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