[英]Validate field for 10 digits javascript
我有一個下面的代碼用於一個字段,必須填寫准確的10個數字
$('#input-payment-egn').on('input', function() { var input=$(this); var is_egn=input.val(); $("div.wrong-egn").hide(); var re = /^\\d{10}$/; var is_egn=re.test(input.val()); if(is_egn<10){ $("div.wrong-egn").show(); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="leasingform"> <div class="form-group required" style="padding-top: 15px;"> <label class="control-label" for="input-payment-egn"><?php echo $text_egn; ?></label> <input type="text" maxlength="10" name="egn" value="" placeholder="Въведете вашето ЕГН" id="input-payment-egn" class="form-control"/> </div> <div class="text-danger" id="wrong-egn" style="display: none;">Въведете валидно ЕГН !</div> </form>
用戶輸入數字后,我想在用戶單擊頁面上其他位置時驗證輸入! 我使用了正則表達式(我認為還可以)。您能幫我嗎? 謝謝!
在這里,您將獲得示例解決方案https://jsfiddle.net/3bgpdp7v/1/
$('#input-payment-egn').keyup(function(e){ if($(this).val().length === 10){ e.preventDefault(); $('#wrong-egn').slideUp(); } else { $('#wrong-egn').slideDown(); } });
#wrong-egn{ display: none; font-size: 12px; color: red; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" maxlength="10" name="egn" value="" placeholder="Въведете вашето ЕГН" id="input-payment-egn" class="form-control"/> <div id="wrong-egn">Please provide 10digit number.</div>
我使用jQuery
keyup
事件並檢查字符數,而不是regex
。
另一種方式這是另一種解決方案https://jsfiddle.net/3bgpdp7v/2/
$('#input-payment-egn').keyup(function(e){ if($(this).val().length === 10) e.preventDefault(); }).focusout(function(){ if($(this).val().length === 10){ $('#wrong-egn').slideUp(); } else { $('#wrong-egn').slideDown(); } });
#wrong-egn{ display: none; font-size: 12px; color: red; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" maxlength="10" name="egn" value="" placeholder="Въведете вашето ЕГН" id="input-payment-egn" class="form-control"/> <div id="wrong-egn">Please provide 10 digit number.</div>
這將在focusout
時顯示消息。
希望這會幫助你。
如果您希望僅在用戶單擊時顯示該行為,則建議使用focusout事件。 如果用戶使用跳出功能,這也會捕獲。
這是一個例子。 小提琴
<input type="text" maxlength="10" name="egn" value="" placeholder="Въведете вашето ЕГН" id="input-payment-egn" class="form-control"/>
Java腳本
$('#input-payment-egn').focusout(function(e){
if($(this).val().length < 10){
$('#wrong-egn').css('display','block');
}else{
$('#wrong-egn').css('display','none');
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.