JQuery Masked Input是一個JQuery插件,它可以非常方便地為輸入框添加掩碼和可選項。掩碼可以讓你規定輸入的格式,例如日期、電話號碼等等。
要使用這個插件,首先需要在HTML中引入JQuery庫和jquery.maskedinput.js文件:
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script src="jquery.maskedinput.js"></script>
然后,就可以調用.maskedInput()函數來添加掩碼了。例如,要讓輸入框只能輸入10位數字,可以這樣寫:
$('input').maskedInput({ mask: '9999999999' });
上面代碼中,mask屬性規定了掩碼格式。例如,這里的掩碼是“9999999999”,表示必須輸入10位數字。如果要限制輸入日期格式,可以這樣寫:
$('input').maskedInput({ mask: '99/99/9999' });
上面代碼中,掩碼“99/99/9999”表示日期格式,例如“01/01/2021”。
除了mask屬性外,還可以使用其他屬性來配置掩碼。例如,placeholder屬性規定了輸入框內的提示文本:
$('input').maskedInput({ mask: '999.999.999-99', placeholder: '___.___.___-__' });
上面代碼中,placeholder屬性值是掩碼格式,表示輸入框內的初始文本。這樣做可以方便用戶輸入時自行補全。
總之,JQuery Masked Input插件可以方便地為表單添加掩碼和可選項,提高用戶輸入的準確性和方便性。