如何验证长度和匹配所需的字符?

时间:2015-12-07 09:06:39

标签: javascript regex html5 web

如果值与所需类型不匹配,我想隐藏提交按钮,我可以隐藏它的长度,但我的匹配不起作用。

JavaScript代码:

function submitChangej(){

var inputlastName = document.getElementById("lastname"); 
var inputfirstName = document.getElementById("firstname"); 
var inputmobileNumber = document.getElementById("mobilenumber");
var inputidNumber = document.getElementById("idnumber");
var firstname =  /^[a-zA-Z-\s]{2,128}$/; 
var lastname = /^[a-zA-Z-\s]{2,128}$/; 
var mobilenumber = /^[0-9]{10,20}$/;
var idnumber = /^([0-9]){2}([0-1][0-9])([0-3][0-9])([0-9]){4}([0-1])([0-9]){2}?$/;

var inputSubmit = document.getElementById("apply");

var Container = document.getElementById('Agreement');

if((inputfirstName.value.length < 2 || inputfirstName.value.length > 128 ) || ( inputlastName.value.length < 2 || inputlastName > 128 ) || (inputmobileNumber.value.length < 10 || inputmobileNumber > 20) || (inputidNumber.value.length < 13)){


        Container.style.display = 'none';
  }
  else{

        Container.style.display = 'block';
  }
  var Container = document.getElementById('Agreement');
 if((firstname.match(firstname) != null) || (lastname.match(lastname) != null) || (mobilenumber.match(mobilenumber) != null) || (idnumber.match(idnumber) != null)){

        Container.style.display = 'none';
  }
  else{

        Container.style.display = 'block';

  } 
}

HTML代码:

<form >

<label for="firstname"><span class="starRequired"><b>*</b>&nbsp;</span>First name:</label><br> 
<input  type="text" name="firstname" id="firstname"  required  autofocus="autofocus" pattern="[a-zA-Z-\s]{3,128}"  onkeyup="submitChangej();"  onkeypress="checkFirstname(this.value);" value="">

<br/><label for="lastname"><span class="starRequired"><b>*</b>&nbsp;</span>Last name:</label><br>
<input type="text" name="lastname" required id="lastname"  pattern="[a-zA-Z-\s]{3,128}"  onkeyup="submitChangej();" onkeypress="checkLastname(this.value);" 
        onblur="checkLastname(this.value);" value="">  

<br/><label for="mobilenumber"><span class="starRequired"><b>*</b>&nbsp;</span>Mobile Number:</label><br/>              
<input type="text" name="mobilenumber" required  id="mobilenumber" onkeyup="submitChangej();" onkeypress="checkMobilenumber(this.value);"
        onblur="checkMobilenumber(this.value);"  value="">

<br/><label for="idnumber">ID Number:</label><br/>  
<input type="text" name="idnumber" id="idnumber" maxlength="13" onkeyup="submitChangej();" onkeypress="checkIdnumber(this.value);" 
        onblur="checkIdnumber(this.value);" value="">

<div id="Agreement" style="display:none">               
<input type="submit" id="apply" name="apply"  value="Apply"  
onclick="if(!this.form.terms.checked){alert('Please indicate that you accept the Agreement');return false}"/>

<input type="checkbox" id="terms" name="terms" >    
<label id="accept" >I accept the Agreement</label>
<textarea  name="textfield" id="textfield"  rows="10" cols="105" readonly="readonly" >      
     1. Acceptance
     1.1 I have read and accepted the above terms and conditions.
        </textarea>
        </span>
      </div>

    </form>

我在我验证的字段上调用我的方法submitChangej()

如果一切都正确,则应该在匹配和长度无效时隐藏按钮。长度工作正常,但所需字符的匹配不匹配

2 个答案:

答案 0 :(得分:1)

将代码的最后一行更改为:

if(!firstname.test(inputfirstName.value) || !lastname.test(inputlastName.value) || !mobilenumber.test(inputmobileNumber.value) || !idnumber.test(inputidNumber.value)){
    Container.style.display = 'none';
}
else {
    Container.style.display = 'block';
} 

正如已经提到过的那样,你正试图在模式itseld上找到匹配,这没有任何意义。然后,匹配方法用于获取匹配的字符串,但您只想针对某种模式测试字符串,因此请改用 test 方法。

答案 1 :(得分:0)

我建议简化这一点,让浏览器通过将其放在更改侦听器的表单中来为您完成更多的工作:

FunctionName:  Mscrm.LeadCommandActions.qualifyLeadQuick
Library:       $webresource:Lead_main_system_library.js