次のコードは、1 つのフィールドの色を変更するためのものです。
<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>