campaign-edianeh-98

روشهای بررسی تیک خوردن Checkbox در Javascript و jQuery



visibility  
mode_comment   ۰

روشهای بررسی تیک خوردن Checkbox در Javascript و jQuery

روشهای بررسی تیک خوردن Checkbox در Javascript و jQuery

در این مطلب میخوام روشهای مختلفی که با استفاده از اونا میتونین از تیک خوردن Checkbox در Javascript و jQuery مطلع بشید  رو بهتون آموزش بدم. روشهای زیادی برای انجام اینکار وجود داره و در ادامه متداول ترین اونا رو بررسی میکنیم.

در ابتدا کدهای HTML که میخوایم با اونا کار کنیم رو قرار میدم:

میبینید که یک checkbox با id = isAgeSelected قرار داده شده است. در انتها هم یک div وجود داره که id اون txtAge هست و در ابتدا هم اون رو مخفی کردیم و میخوایم با تیک خوردن چک باکس اون رو نشون بدیم.

روش اول: با استفاده از Javascript خالص

میبینید که رویداد onchange برای چک باکس رو تعریف کردیم و زمانی که event.target.checked برابر با true باشه میفهمیم که چک باکس تیک خورده است و در این صورت متن مورد نظر رو نشون میدیم و در غیر اینصورت متن مورد نظر مخفی میشه.

روش دوم: با استفاده از jQuery و رویداد کلیک

کد زیر رو ببینید:

همونطور که میبینید در اینجا از toggle استفاده کردیم و زمانی که this.checked برابر با true باشه، متن مورد نظر نشون داده میشه و در غیر اینصورت مخفی میمونه.

روش سوم: استفاده از متد is

برای اینکار بصورت زیر عمل میکنیم:

در اینجا از متد is استفاده شده و بررسی میکنه که :checked در checkbox وجود داره یا نه.

روش چهارم: استفاده از متد prop

در اینجا هم همانند روش قبل عمل کردیم با این تفاوت که بجای متد is از prop استفاده کردیم. متد prop از jQuery نسخه 1.6 به بالا وجود داره و قبل از اون نمیتونین از این ورژن استفاده کنید.

اگر شما هم روشی برای انجام اینکار به ذهنتون میرسه خوشحال میشیم که در بخش نظرات با ما در میان بذارید.

متخصص جاوا اسکریپت
با جاوا اسکریپت جادوگری کنید! آیا می دونید با زبان جاوااسکریپت می تونید، برای فرانت اند و بک اند وبسایت ها برنامه نویسی کنید؟ همینطور اپلیکیشن دسکتاپ و موبایل بسازید؟ اگر دوست داری اینکارها رو انجام بدی و React, ElectronJS, ReactNative, NodeJS,MongoDB و ... رو تو یه دوره یاد بگیری، متخصص جاوااسکریپت سون لرن رو حتما ببین : متخصص جاوا اسکریپت arrow_back
comment دیدگاه کاربران

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

خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :