Element get by Class
Dear Sir,
i recently coded here, having problem that, how can i get Class insted of document.getElementById().value?
code:
<html>
<head>
<title>Onblur Onchange Functions</title>
<style type ="text/css">
.onfocus
{
border:2px solid #306EFF;
height: 23px;
width: 148px;
padding: 3px 5px 0 5px;
background:none;
font: normal 13px Arial, Helvetica, sans-serif;
}
.onblur
{
border:1px solid #041e33;
height: 22px;
width:147px;
padding: 3px 5px 0 5px;
background:none;
font: normal 13px Arial, Helvetica, sans-serif;
}
.fname {
width: 167px;
height: 20px;
padding: 3px 5px 0 5px;
margin: 3px 0 5px 10px;
background:none;
font: normal 11px Arial, Helvetica, sans-serif;
border: 1px solid #041e33;
color: #34312C;
}
</style>
<script type="text/javascript">
function upperCase(obj, evt)
{
var x=document.getElementById("fname").value;
document.getElementById("fname").value=x.toUpperCase();
if(evt.type=="focus")
obj.className ="onfocus";
else if(evt.type=="blur")
obj.className ="onblur";
}
</script>
</head>
<body>
Enter your name: <input type="text" id="fname" style="color: #34312C;" onfocus="upperCase(this, event)"onblur="upperCase(this, event)" />
<br />
<br />
Enter your age: <input type="text" id="age" onblur="alert(this.id)" />
<br />
</body>
</html>
in the case i need to get first text box default first thats controlled by css class. and onfocus event want to change border color. in onblur event it should be appear to default. it last two event working
i tried write like :
var x=document.getElementByClassName("fname").value;
but in this way its not working
so please guide me...
Thanks
Santosh Hegde
