前端學習程式碼例項-input文字框焦點背景變色
摘要：
很多網頁表單設計中，當文字框獲得焦點的時候會改變它的樣式屬性，可以提高文字框的辨識度。
下面以設定背景色為例子，對此功能做一下簡單介紹。
程式碼例項如下:
<!DOCTYPE html>
<html>
<head>
&l...
很多網頁表單設計中，當文字框獲得焦點的時候會改變它的樣式屬性，可以提高文字框的辨識度。
下面以設定背景色為例子，對此功能做一下簡單介紹。
程式碼例項如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>web前端開發學習q群：731771211詳細教程講解</title>
<style type="text/css">
.bg{background-color:red;}
</style>
<script>
window.onload=function(){
var inputs=document.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++){
inputs[i].onfocus = function (){
this.className="bg";
}
inputs[i].onblur=function(){
this.className="";
}
}
}
</script>
</head>
<body>
<form id="myform" action="#">
<ul>
<li>使用者名稱:<input type="text" name="username" /></li>
<li>密碼：<input type="text" name="pw" /></li>
</ul>
</form>
</body>
</html>