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

最新推荐文章于 2024-11-08 16:09:18 发布

aio69762

最新推荐文章于 2024-11-08 16:09:18 发布

阅读量111

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/rsail/archive/2012/09/17/2689835.html

版权

Input
RegExp
Result

源码如下：

<html><head></head>
<body>
    <label for="">Input &nbsp;&nbsp;</label>
    <input id="inputText" type="text" οnchange="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" οnchange="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 =

转载于:https://www.cnblogs.com/rsail/archive/2012/09/17/2689835.html