ساخت دکمه نمایش رمزعبور در جاوا اسکریپت
ساخت دکمه نمایش رمزعبور در جاوا اسکریپت

ساخت دکمه نمایش رمزعبور در جاوا اسکریپت

درود. امروز قصد داریم نحوه ساخت دکمه نمایش رمزعبور در جاوا اسکریپت را برای شما دوستان آموزش بدیم.

حتما در سایت های مختلف دیده اید که در کنار input رمزعبور ، یک علامت چشم یا قفل وجود دارد که با کلیک بر روی آن ، رمزعبوری که وارد کرده اید از حالت مخفی خارج شده و می توانید آن را ببینید و ویرایش کنید.

امروز قصد داریم با چند خط کد جاوا اسکریپت این کار را انجام دهیم.

پس بریم که شروع کنیم.

ساخت دکمه نمایش رمزعبور در جاوا اسکریپت

 

ساخت دکمه نمایش رمزعبور در جاوا اسکریپت
ساخت دکمه نمایش رمزعبور در جاوا اسکریپت

 

برای شروع یک input از نوع password در سند html خود ایجاد می کنیم.

همچنین یک checkbox نیز در زیر input قرار می دهیم.

کار این چک باکس این است که اگر کاربر آن را تیک زد ، رمزعبور به کاربر نمایش داده شود و اگر تیک آن را برداشت ، رمزعبور مجددا مخفی شود.

 

 

همونطور که می بینید به هر input یک آیدی نیز داده ایم که در جاوا اسکریپت بتوانیم از این آیدی ها استفاده کنیم.

خب. حالا نوبت نوشتن جاوا اسکریپت است.

ابتدا یک function تعریف می کنیم که در صورتی که کاربر چک باکس را انتخاب کرد ، کدهای ما اجرا شود :

 

در مرحله بعد کافی است یک if قرار بدهیم.

به این صورت که اگر type یا نوع input ما password بود ، آن را به text و اگر text بود به password تغییر دهد.

 

 

به همین راحتی ما تونستیم کار دکمه نمایش رمزعبور در جاوا اسکریپت را ایجاد کنیم.

شما می تونید این کد رو برای جی کوئری و… هم تغییر بدید و ازش استفاده کنید.

امیدوارم که این آموزش به دردتون خورده باشه و در در پروژه هاتون بتونید ازش استفاده کنید.

در صورتی که سوال ، مشکل یا انتقاد و یشنهادی داشتید در قسمت نظرات همین پست ، برای ما بنویسید.

گروه برنامه نویسی دات وب

.

.

.

.

پایان

درباره‌ی مهران مافی

حتما ببینید

بدست آوردن تعداد فالوورهای پیج اینستاگرام با جاوا اسکریپت

بدست آوردن تعداد فالوورهای پیج اینستاگرام با جاوا اسکریپت

درود. امروز قصد داریم نحوه بدست آوردن تعداد فالوورهای پیج اینستاگرام با جاوا اسکریپت را …

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *