表单敏感词过滤和验证

HTML

                        
<h2>反馈表</h2> 
<p><span class="error"> * 必须输入的</span></p>
<form method="post" action="" id="myform" name="myform">
    姓名：
    <input type="text" name="name" id="name" value="<?php echo $name;?>">
    <span class="error">*</span>
    <br><br>
    邮箱：
    <input type="text" name="email" id="email" value="<?php echo $email;?>">
    <span class="error">*</span>
    <br><br>
    网址：
    <input type="text" name="website" id="website" value="<?php echo $website;?>">
     <span class="error"></span>
    <br><br>
    评论：
    <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea>
    <br><br>
    性别：
    <input type="radio" name="gender"
<?php if (isset($gender) && $gender=="female") echo "checked";?> 
value="female">
    女性
    <input type="radio" name="gender" 
<?php if (isset($gender) && $gender=="male") echo "checked";?> 
value="male">
    男性
    <span class="error">*</span><br><br>
    <input type="submit" name="submit" value="提交">
</form>
<h2>您的输入：</h2>

    					

JS

window.addEventListener("load",load,false); 
//表单验证监控变量，当值大于等于3，说明通过了用户名、Email和URL验证，则允许提交
var key = 0;
function load(){
	//检查用户名
    var name = document.myform.name;
    name.addEventListener("change",function(){
		check(this, isname, "* 请输入真实的中文名字！" )
	},false);
	//检查Email
    var email = document.myform.email;
    email.addEventListener("change",function(){
		check(this, isemail,  "* 请输入合法的Email地址！" )
	},false);	
	//检查URL
    var url = document.myform.website;
    url.addEventListener("change",function(){
		check(this, isurl,  "* 请输入合法的URL地址！" )
	},false);
	document.myform["submit"].addEventListener("click",function(event){
		//检查性别是否选中
		var sex = document.myform.gender;
		var err_ele =  get_title( sex[1] );		
		if (!sex[0].checked && !sex[1].checked  ){
			err_ele.innerHTML = "* 请选择性别!";
		}else{
			err_ele.innerHTML = "*";
			if(!sex.added){ 
				key += 1; 
				sex.added = true;
			};		
		};
		//根据验证监控变量确定是否允许提交表单，只有通过了4个必必填项目才允许
		if(key < 4 ){
			var event = event || window.event;
			event.preventDefault(); // 兼容标准浏览器
			window.event.returnValue = false; // 兼容IE6~8
			return false;
		}
	},false);
}
//检查函数
function check(id, isfn, err ){
	var  ele = (typeof id == "object")?id: document.getElementById( id );
	var  isfn = isfn;
	var err = err;
	var err_ele = get_title(ele);
    if (isfn(ele.value)==null) {
		if(ele.added){ 
			key -= 1; 
			ele.added = false;
		};
        err_ele.innerHTML = err;
    }
    else{
		if(!ele.added){ 
			key += 1; 
			ele.added = true;
		};
        err_ele.innerHTML = "*";
    }
}
//找到表单对象ele后面的错误提示框
function get_title(ele){
	var _ele = ele.nextSibling;
	while(_ele){
		if(_ele.nodeType == 1 && _ele.className == "error") return _ele;
		_ele = _ele.nextSibling;
	}
	return null;	
}
//检查用户名
function isname(str){
    var reg = /^[\u4E00-\u9FA5]{2,5}(?:·[\u4E00-\u9FA5]{2,5})*$/;
    return reg.exec(str);
}
//检查URL
function isurl(str){
    var reg = /^((http|https):\/\/(\w+:{0,1}\w*@)?(\S+)|)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/;
    return reg.exec(str);
}
//检查Email
function isemail(str){
    var reg = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
    return reg.exec(str);
}