rydning af flere tekstbokse vha. addlistener
Jeg har en side med flere tekstbokse, hvor jeg ønsker en funktion som fungere på følgende måde.på onfocus ryddes teksten, hvis det er tekstboksens standard værdi.
På onfocus skiftes class name til "second"
På onblur sættes tekstboksens standard værdi hvis boksen er tom.
På onblur skiftes class name til "first"
Jeg har prøvet lidt selv her, men det funger ikke helt endnu, og er ikke dynamisk.
--------------------kode------------------
<html>
<head><title></title>
<script type="text/javascript" language="javascript">
<!-- Hide from browsers without javascript
var txtTextbox = "firstname"
function addListener(oNode, sEventType, fnHandler)
{
//If there are prior event handler functions
//that have been assigned to this event handler,
//then save them:
if(oNode[sEventType])
var oldfuncs = oNode[sEventType];
//Assign new function to the
//element's event handler:
oNode[sEventType] = function ()
{
if (oldfuncs) oldfuncs();
fnHandler();
}
}
//Test out the addListener() function:
window.onload=function()
{
var div = document.getElementById("d");
addListener(div, "onfocus", clear);
}
function clear()
{
var inputs = document.getElementsByTagName("input");
for (i=0; i < inputs.length; i++) {
inputs[i].onfocus=function() {this.className='second'};
inputs[i].onfocus=function() {this.value=''};
inputs[i].onblur=function() {this.value=txtTextbox};
}
}
// End hiding -->
</script>
</head>
<style type="text/css">
.first{
color: #999;
}
.second{
color: #000;
}
</style>
<body>
<input type="text" class="first" value="firstname" id="d" />
<input type="text" class="first" value="lastname" id="d" />
</body>
</html>
