سبد (0)

پلاگین ماسک گذاری

پلاگین Masked Input

با استفاده از پلاگین Masked Input قادر خواهید بود تا فیلدهای ورودی (Input) را ماسک گذاری کنید. این پلاگین به شما اجازه می دهد تا کاربران را مجبور به وارد کردن یک فرمت خاص در فیلدها کنید.

فیلدهای تاریخ، شماره تلفن و ... از انواع فیلدهایی هستند که می توان روی آنها ماکس تعریف کرد.

این پلاگین در اکثر مرورگرهای معروف مانند Internet Explorer, Firefox , Safari, Opera, Chrome تست شده است.


نحوه ی تعریف ماسک

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

  1. a: نماینده یک حرف الفبا است.
  2. 9: نماینده یک کاراکتر عددی است.
  3. *: نماینده یک کاراکتر عددی یا الفبایی است.

 نحوه ی استفاده از پلاگین Masked Input در jQuery

در مثال های زیر، نحوه ی استفاده از پلاگین ماسک گذاری آورده شده است:

مثال 1: در این مثال دو فیلد تاریخ و شماره تلفن را ماسک گذاری کرده ایم:

پلاگین ماسک گذاری - مثال 1

$("#date").mask("99/99/99");
$("#phone").mask("999-9999999");
خودتان امتحان کنید »

مثال 2: اگر می خواهید بجای "_" از خط فاصله و یا هر کاراکتر دلخواه دیگری استفاده کنید، باید پارامتر دوم متد mask را بصورت زیر تنظیم کنید:

پلاگین ماسک گذاری - مثال 2

$("#date").mask("99/99/99",{placeholder:" "});
$("#phone").mask("999-9999999",{placeholder:"*"});
خودتان امتحان کنید »

مثال 3: در این مثال با استفاده از تابع Callback، بلافاصله بعد از وارد کردن صحیح فرمت تاریخ توسط کاربر یک پیغام نمایش داده می شود:

پلاگین ماسک گذاری - مثال 3

$(document).ready(function(){
   $("#date").mask("99/99/99",{
          completed: function() {
                alert("شما فرمت صحیح را وارد کردید "+this.val());
          }
   });
});
خودتان امتحان کنید »

 مثال 4: در این مثال با استفاده از خصوصیت definitions، یک ماسک گذاری سفارشی ایجاد کرده ایم.

پلاگین ماسک گذاری - مثال 4

$(document).ready(function(){
   $.mask.definitions['~']='[+-]';
   $("#eyescript").mask("~9.99 ~9.99 999");
});
خودتان امتحان کنید »

دانلود فایل پلاگین Masked Input

منبع: http://foswiki.org/System/JQueryMaskedInput

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه