508
文本框獲得失去焦點——js和jquery方法的對比
Js方法
<head>
<script type="text/javascript">
function Doit() {
//
獲得一個input的數組,需要遍曆
var inputs = document.getElementsByTagName_r("input");
for (var i = 0; i < inputs.length; i++) {
// 如果是文本控件
if (inputs[i].type == "text") {
// 前麵有on——
inputs[i].onfocus = function () {
// 通過this直接獲取觸發的元素
this.style.backgroundColor = "yellow";
};
inputs[i].onblur = function () {
this.style.backgroundColor = "white";
};
}
}
}
</script>
</head>
<body >
<input type="text" />
<input type="text" />
<input type="text" />
<input type="button" value="button" />
</body>
</html>
Jquery方法
<head>
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
// 不需要遍曆
$('input[type=text]').click(function () {
// this前麵要加dollar符
$(this).css("backgroundColor","yellow");
}).blur(function () { $(this).css("backgroundColor","white");});
// blur前麵沒有on
});
</script>
</head>
<body>
<input type="text" />
<input type="text" />
<input type="text" />
<input type="button" value="button" />
</body>
</html>
最後更新：2017-04-02 22:16:01