Question

在向服务器发送序列号具有此格式的请求之前，如何在提交时验证表单字段：

 <input type="text" id="serial" placeholder="123AB-BCXH3-778F2-90763">

（20个字符，每5个字符分隔一次）

由于

回答

以前的标题是： Javascript检查字符串格式

我的问题是如何使用Javascript进行验证，但下面的Joe给出了一个使用正则表达式的好例子，我从未使用过正则表达式，但这就是我今天所学到的：

^ \ w {5} - \ w {5} - \ w {5} - \ w {5} $ 我的串行格式为5个字符后跟＆＃34; - ＆＃34;

\ w =＆gt;是字符a-z，A-Z，0-9
{5} =＆gt;数5个字符
\ - =＆gt;反斜杠使元字符被视为a 角色，这里＆＃34; - ＆＃34;
$ =＆gt;字符串结尾
^ =＆gt;起始位置

Answer 1

这是functional fiddle

<form>
    <input type="pid"  id="pid" maxlength="23" pattern="^\w{5}\-\w{5}\-\w{5}\-\w{5}$" required value="123AB-BCXH3-778F2-90763" size="35"/>

    <input type="submit" value="Submit" />
</form>

Answer 2

JavaScript解决方案是在验证之前使用正则表达式验证您的输入。

在表单中使用onsubmit调用验证方法，例如：

<form name="myform" onsubmit="return validate();" >
   <input type="text" name="myinput" id="serial" placeholder="123AB-BCXH3-778F2-90763">
</form>

您的验证方法应如下所示：

function validate() {
    var input =  document.myform.myinput.value;
    var regExp = "^\w{5}\-\w{5}\-\w{5}\-\w{5}$";
    var match = url.match(regExp);
    if (match){
        return true;
    }else{
        alert("Not valid");
        return false;
    }
}

因此，除非输入可以接受，否则这将阻止用户发布。

HTML5 - 使用模式属性验证输入字段

2 个答案: