以下代码用于更改一个字段的颜色:
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<form></form>
<form>
<input name="thisone" />
</form>
<script language="javascript">
var bkColor = "red";
function getEvent(e){
if(window.event != null) {
return event;
}
return e;
}
function setBKColor(e){
e = getEvent(e);
var src = e.srcElement || e.target;
window.status="t";
if(src != null) {
src.style.bkColor = src.style.backgroundColor;
src.style.backgroundColor = bkColor;
}
}
function reSetBKColor(e){
e = getEvent(e);
var src = e.srcElement || e.target;
if(src != null) {
src.style.backgroundColor = src.style.bkColor;
}
}
function attachEvent(name,element,callBack) {
if (element.addEventListener) {
element.addEventListener(name, callBack,false);
} else if (element.attachEvent) {
element.attachEvent('on' + name, callBack);
}
}
function setListner(eve,func) {
var ele = document.forms[0].elements;
for(var i = 0; i <ele.length;i++) {
element = ele[i];
if (element.name) {
switch (element.name) {
case 'thisone':
attachEvent(eve,element,func);
}
}
}
}
setListner("focus",setBKColor);
setListner("blur",reSetBKColor);
</script>
但是,在更改颜色的字段之前还有另一种形式时,代码停止工作。所以目前HTML代码看起来像这样,以配合不便之处:
<name="thisone">
<form></form>
<form></form>
现在这段代码有效了。
但是如何使JS部分独立于<form>
,并且只依赖于文本字段的<Name>
?
答案 0 :(得分:2)
在表单中添加一个id并使用它来引用它
function setListner(eve,func) {
var ele = document.getElementById("#formID").elements;
在DOM中使用表单索引是访问其元素的不可靠方式