10行HTML代码构建JS正则表达式验证器



 

源码如下：

<html><head></head>
<body>
    <label for="">Input &nbsp;&nbsp;</label>
    <input id="inputText" type="text" onchange="var rule = new RegExp(document.getElementById('reg').value), input=document.getElementById('inputText').value; document.getElementById('result').value=input.match(rule);" /><br />
    <label for="">RegExp</label>
    <input id="reg" type="text" onchange="var rule = new RegExp(document.getElementById('reg').value), input=document.getElementById('inputText').value; document.getElementById('result').value=input.match(rule);" /><br />
    <label for="">Result &nbsp;</label><input id="result" type="text" />
</body></html>

其中关键性代码为这一段JavaScript代码：

var rule = new RegExp(document.getElementById('reg').value), //从正则表达式输入框获取输入文本构建正则表达
    input=document.getElementById('inputText').value; //获取待验证的文本

document.getElementById('result').value=input.match(rule); //将匹配结果输出到结果显示框

可以用以下值简单验证：

input：    a = b + c;

RegExp:  [\s\S]+=

按下tab键触发事件，可以看到：

Result:    a =

posted @ 2012-09-17 22:57  yunfan85  阅读(1123)  评论(0)  编辑  收藏  举报