下面我来描述一下正则的组件:

首先,我们定义一个对象如koringz

koringz=function(){}||{};

其次,我们再给这个koringz对象添加一个方法,目前是验证正则的文本框,所以我给这个方法定义为正则的大写英文字母REGEXP。

koringz.REGEXP = function(){

}

下面我要给REGEXP 传入三个参数进去,doc表示input[type=’text’]文本的dom节点,reg就是要匹配的内部值的正则表达式,tag就是输出的这个信息的节点的标签(当然也可以是一个类或id),于是乎:

koringz.REGEXP = function(doc,reg,tag){

}

有了上面的方法,下面我们要有一个事件实时监听文本框的动态数据,oninput可以表示数据的监听:

koringz.REGEXP = function(doc,reg,tag){

doc.oninput = function(){

}

}

下面就是开始执行的判断,当为空时,我们可以处理的方法:

if(this.value == ""||this.value == "undefined") conlose_null_method(tag) //fun1()输出条件

当不为空时,我们可以处理下面的方法:

else conlose_match_method(This,reg,tag) //fun2()输出方法

那么调用的方法可以这么写:

function conlose_null_method(tag){ tag.innerHTML = "您还没有输入!"}

function conlose_match_method(This,reg,span){

if(reg.test(This.value)) span.innerHTML = "输入正确!"

else span.innerHTML ="您输入的不正确!"

}

最后,我们只要在html页面写入如下的样式调用即可:

假如现在我们有一个div块:

<div class="name">

        <label for="name"></label>

        <input type="text" vlaue="" placeholder="请输入姓名" id="name">

        <span>*</span>

</div>

然后下面的js调用函数:

<script type="text/javascript">

    var _name = document.getElementById("name");

    var match_name = /^[\u4E00-\u9FA5]+$/;

    var span_name = _name.parentNode.children.item(2);

    koringz.REGEXP(_name,match_name,span_name)

 </script>

基本到这里就已经完成了以上的步骤,如果你想看详细的内容可以进这里,或者想看视图点koringz,如果你想下载点koringz