关于chrome插件开发（四）即时监控inpu

function input_filter(){
			var list=document.getElementById("q");//要操作input的ID
		
	        var re_input =/select|update|delete|truncate|join|union|exec|insert|count|drop|script|'|"|;|>|<|\|[|]|=|{|}/i;

	                if("\v"=="v") {
                        list.onpropertychange = inputChange;
                   }else{
                        list.addEventListener("input",inputChange,false);
                    }
                  
              
                 function inputChange(){
                   if(re_input.test(list.value)){
            
                       list.value = list.value.replace(re_input,"");
					      alert("请勿输入非法字符"); 	
					   
				  }
                }		
}


		input_filter();





如果需要监控input的输入，并且过滤掉一些字符，则可以用上面的代码，特别注意的是要用到oninput这个事件。可以参看这个链接点击打开链接
首先关于onchange和onpropertychange：
    IE下，当一个HTML元素的属性改变的时候，都能通过 onpropertychange来即时捕获。
onchange在属性值改变时还必须使得当前元素失去焦点(onblur)才可以激活该事件。
   对于其他浏览器，我们可以用oninput事件来实现onpropertychange的效果，但是，将oninput写在JS代码中分离出来时与普通事件注册的方法有些不同，必须使用addEventListener来注册。(附上一个例子，区别普通事件注册和js中应用的区别)











直接写在页面中的示例：

您输入的值为：还未输入






写在JS中的示例：

您输入的值为：还未输入







addEventListener的使用方式 :
target.addEventListener(type,listener,useCapture); 
target： 文档节点、document、window 或 XMLHttpRequest。 
type： 字符串，事件名称，不含“on”，比如“click”、“mouseover”、“keydown”等。 
listener ：实现了 EventListener 接口或者是 JavaScript 中的函数。 
useCapture ：是否使用捕捉，一般用 false 。例如：document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);