Javascript-如何使用RegExp识别模式

Javascript - how to identify the pattern using RegExp

本文关键字:识别 模式 RegExp 何使用 Javascript-      更新时间:2023-09-26

当用户输入错误时,提交按钮应该弹出一条警告消息,说明邮政编码和邮政编码上的模式错误。但我似乎无法让它发挥作用。我不想在表单中使用"pattern="。我想显示一个警告框。我需要使用RegExp方法。有什么想法吗?

这是我的代码:

                <script>
                function validation(){
                  var icn = document.getElementById("icno").value;
                  var postcode = document.getElementById("pstcode").value;
                  var regexp = new RegExp(icn,"'d{6}-'d{2}-'d{4}");
          var regexp1 = new RegExp(postcode,"[0-9]{5}");
                  if (regexp.exec(icn)){
            return true;
                  }
                  else{
            alert("Please enter your IC correctly")
                  }
          if (regexp1.exec(postcode)){
            return true;
                  }
                  else{
            alert("Please enter your postcode correctly")
                  }
                }
                </script>
            </body>
    </html>

如果您想使用RegExp.exec,请尝试以下操作:

function validation() {
  var icn = document.getElementById("icno").value;
  var postcode = document.getElementById("pstcode").value;
  var regexp = new RegExp(/'d{6}-'d{2}-'d{4}/);
  var regexp1 = new RegExp(/[0-9]{5}/);
  if (regexp.exec(icn) !== null) {
    return true;
  } else {
    alert("Please enter your IC correctly")
  }
  if (regexp1.exec(postcode) !== null) {
    return true;
  } else {
    alert("Please enter your postcode correctly")
  }
}
<form id="myForm" onsubmit="validation()">
  <fieldset>
    <legend>Regular Expression</legend>
    <label for="name">Name</label>
    <input type="text" id="name" size="30" placeholder="Enter name.">
    </br>
    </br>
    <label for="icno">IC No</label>
    <input type="text" id="icno" size="15" placeholder="E.g. 889601-11-6575">
    </br>
    </br>
    <label for="address">Address 1</label>
    <input type="text" id="address" size="30" placeholder="Address 1">
    </br>
    </br>
    <label for="address">Address 2</label>
    <input type="text" id="address" size="30" placeholder="Address 2">
    </br>
    </br>
    <label for="postcode">Postcode</label>
    <input type="text" id="pstcode" size="8" placeholder="E.g 21030">
    </br>
    </br>
    <input type="submit" value="Submit" id="btnSubmit">
  </fieldset>
</form>

但我建议你使用.test,它很简单:

function validation() {
   var icn = document.getElementById("icno").value;
   var postcode = document.getElementById("pstcode").value;
   if (/'d{6}-'d{2}-'d{4}/.test(icn)) {
     return true;
   } else {
     alert("Please enter your IC correctly")
   }
   if (/[0-9]{5}/.test(postcode)) {
     return true;
   } else {
     alert("Please enter your postcode correctly")
   }
 }

定义RegExp时,可以传递两个参数:1)模式,2)标志。您将包含要搜索的文本的变量作为第一个参数,将模式作为第二个参数。

第二个问题是,您期望一个完整的字符串匹配,因此,您错过了锚点(^-字符串的开始-和$-字符串的结束)。

var regexp = /^'d{6}-'d{2}-'d{4}$/;
var regexp1 = /^'d{5}$/;

然后纠正if块:

var icn_check = regexp.test(icn);
var pcode_check = regexp1.test(postcode);
if (icn_check && pcode_check){      // Only return true if both fields are valid
   return true;
}
else {
  if (!pcode_check) {                                // If post code is invalid
    alert("Please enter your postcode correctly");
  }
  if (!icn_check) {                                  // If ICN is invalid
    alert("Please enter your IC correctly");
  }
}

并使用RegExp#test()而不是exec()来检查字符串是否与正则表达式匹配。

查看JS fiddle演示

function validation() {
  var icn = document.getElementById("icno").value;
  var postcode = document.getElementById("pstcode").value;
  var regexp = /^'d{6}-'d{2}-'d{4}$/;
  var regexp1 = /^'d{5}$/;
  var icn_check = regexp.test(icn);
  var pcode_check = regexp1.test(postcode);
  if (icn_check && pcode_check) {
    return true;
  } else {
    if (!pcode_check) {
      alert("Please enter your postcode correctly");
    }
    if (!icn_check) {
      alert("Please enter your IC correctly");
    }
  }
}
<form id="myForm" onsubmit="validation()">
  <fieldset>
    <legend>Regular Expression</legend>
    <label for="name">Name</label>
    <input type="text" id="name" size="30" placeholder="Enter name.">
    <br/>
    <br/>
    <label for="icno">IC No</label>
    <input type="text" id="icno" size="15" placeholder="E.g. 889601-11-6575">
    <br/>
    <br/>
    <label for="address">Address 1</label>
    <input type="text" id="address" size="30" placeholder="Address 1">
    <br/>
    <br/>
    <label for="address">Address 2</label>
    <input type="text" id="address" size="30" placeholder="Address 2">
    <br/>
    <br/>
    <label for="postcode">Postcode</label>
    <input type="text" id="pstcode" size="8" placeholder="E.g 21030">
    <br/>
    <br/>
    <input type="submit" value="Submit" id="btnSubmit">
  </fieldset>
</form>