0
我使用嚮導單擊下一步按鈕不檢查使用正則表達式驗證電子郵件。 我已經使用開關盒第一空白輸入顯示錯誤，否則進入下一步，並添加電子郵件輸入值錯誤後不檢查電子郵件這個值在Reg如何解決這個問題。如何查看電子郵件有效性？
<form>
<div class="form-main">
<div class="form-input">
<input type="text" id="fname" placeholder="First Name">
<p id="error"></p>
</div>
<div class="form-input">
<input type="text" id="lname" placeholder="Last Name">
<p id="error"></p>
</div>
<div class="form-input">
<input type="email" id="email" placeholder="Email">
<p id="error"></p>
</div>
<div class="form-input">
<input type="password" id="password" placeholder="Password">
<p id="error"></p>
</div>
<div class="form-btn">
<button type="button" id="prev" onClick="prevBtn(this);">prev</button>
<button type="button" id="next" onClick="nextBtn(this);">next</button>
<button type="submit" id="submit">submit</button>
</div>
</div>
</form>
首先是讓變量的正則表達式中進行函數emailValidate名稱，在此功能中採用可變mailFormate這回文本電子郵件。此功能用於切換情況下，如果輸入值爲空白，則顯示錯誤，否則檢查輸入類型文本和電子郵件，但電子郵件爲空白如果添加電子郵件格式時顯示錯誤，則不檢查RegEx跳過下一步如何解決此問題。
$(window).on('load',function(){
$('.form-main > .form-input:nth-child(1)').addClass('open');
$('.form-main > .form-input:not(".open")').addClass('close').hide();
});
var $div = $('.form-input');
var submits = $('#submit').css('display','none');
index = 0;
function updateStatus(a){
$div.eq(index).removeClass('current').addClass('close').hide();
index += a;
$div.eq(index).addClass('current').removeClass('close').show();
$('#next').toggle((index !==$div.length-1));
$('#prev').toggle(index !== 0);
if(index == ($div.length - 1)){
submits.toggle(index !== 0);
}else{
submits.hide();
}
}
var input = document.getElementsByTagName('input');
var error = document.getElementById('error');
var regEx = {
emailValidate : function emailValidate(email){
var mailFormate = /^(([^<>()\[\]\\.,;:\[email protected]"]+(\.[^<>()\[\]\\.,;:\[email protected]"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return mailFormate.test(email);
}
}
function validation(){
var inputValue = $('input:visible').val();
var inputType = $(input).attr('type');
if(inputValue !== ''){
switch(inputType){
case 'text' :{
updateStatus(+1);
}
case 'email' :{
var email = regEx.emailValidate(inputValue);
if(!email){
error.innerHTML = "please enter valid mail";
return false;
}else{
error.innerHTML = "valid";
updateStatus(+1);
}
break;
}
default : '';
}
}else{
$('input:visible').next().html("please enter the value");
}
}
function nextBtn(){
validation();
}
function prevBtn(){
updateStatus(-1);
error.innerHTML = '';
}
你可以在輸入標籤中設置模式屬性吧？ – Jok3r
是的，正確的mailFormate是電子郵件模式。 – Dhaval
''點擊「提交」檢查電子郵件驗證，如果電子郵件無效 –