JS文件：复制代码 代码如下:function mouseAction() { var textInputs = document.getElementsByTagName("input"); var len = textInputs.length; var index = 0; var textInput; /* 也能用 for in 语句遍历 for (textInput in textInputs){ textInputs[textInput].onmouseover = functionName; } */ for( index = 0; index < len; index++ ) { textInput = textInputs[index]; if( textInput.getAttribute("type") == "text" ){ textInput.onmouseover = function (){ //也能用这种方式 this.style.backgroundColor = "red"; this.className = "txtMouseOver"; //要先在HTML中引入CSS文件 }; //注意要加分号 textInput.onmouseout = function(){ this.className = "txtMouseOut"; }; textInput.onfocus = function(){ this.className = "txtMouseFocus"; }; textInput.onblur = function(){ this.className = "txtMouseBlur"; }; } } } //也可以直接跟一个函数名，不要加引号，括号 window.onload = mouseAction; window.onload = function(){ mouseAction(); };CSS文件：复制代码 代码如下:/*主体居中显示*/ body{ width: 80%; height: 800px; position: relative; margin-left: 10%; /*left: -40%;*/ border: #00CCFF solid thin; } .txtMouseOver { border-color: #9ecc00; } .txtMouseOut { border-color: #84a1bd; } .txtMouseFocus { border-color: #9ecc00; background-color: #e8f9ff; } .txtMouseBlur { border-color: #84a1bd; background-color: #ffffff; }

　　推荐阅读

　　javascript 复杂的嵌套环境中输出单引号和双引号

<a href="javascript:alert('这里有2个单引号一个双引号&#34;&#39;&#39; :)');" >引号的嵌套</a> 单引号 ‘ 的 ASCII码是 39 双引号 " 的 ASCII码是34，所以我们可以用&#xxx;的形式来代替具体的符号。虽然变成了>>>详细阅读

本文标题：鼠标经过的文本框textbox变色

地址：http://www.17bianji.com/kaifa2/JS/28662.html

 1/2    1