<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="textml; charset=utf-8" /> <title>输入框点击时边框变色效果</title> </head> <body> <style type="text/css"> .focusInput {border:1px solid #99CC33;} </style> <script type="text/javascript"> function focusInput(focusClass) { var elements = document.getElementsByTagName("input"); for (var i=0; i < elements.length; i++) { if (elements[i].type != "button" && elements[i].type != "submit" && elements[i].type != "reset") { elements[i].onfocus = function() { this.className = focusClass; }; elements[i].onblur = function() { this.className = ''; }; } } } window.onload = function () { focusInput('focusInput'); } </script> 请输入姓名：<input type="text" /> </body> </html>