|
|
|
In this example we are going to Change CSS of Form on Button Click event.
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Changing Text and Background color on button Click</title>
<script language="javascript" type="text/javascript">
var toggle=false;
function doIt()
{
if(toggle)
{
document.exf1.t1.style.color="green";
document.exf1.t1.style.backgroundColor="orange";
}
else
{
document.exf1.t1.style.color="#000440";
document.exf1.t1.style.backgroundColor="#d0d0d0";
}
document.exf1.toggle.value=toggle=!toggle;
}
</script>
</head>
<body>
<form name="exf1">
<input style="color:#000440;background-color:#d0d0d0;" type="text" name="t1" value="text value" />
<br />
<input type="text" readonly="readonly" value="false" name="toggle" />
<br />
<input type="button" name="b1" value="Click Me" onclick="doIt()" />
<br />
</form>
</body>
</html> | | |
|
| JavaScript dropdown list menu to switch any page. Categories : Java Script, Beginner Guides, Form Processing | | | Show hide table rows to make dynamic forms Categories : Beginner Guides, Java Script, Form Processing, HTTP | | | Form Processing : with alert Highlight field name which is not filled by user Categories : Java Script, Form Processing, Data Validation, Beginner Guides, Web Design | | | Simple Javascript CSS Digital Clock Categories : Java Script, Date Time, CSS, Beginner Guides, Web Design | | | Show or Hide your Content using Javascript Categories : Java Script, HTML, CSS, Beginner Guides | | | Hilight Form Element onFocus Categories : Java Script, Form Processing, CSS | | | Conditional Check - a script that allows a user to submit a form only if the user check a checkbox. Categories : HTML, Java Script, Form Processing, Beginner Guides | | | PHP and javascript mouseover, mouseout, and mousedown events Categories : PHP, Java Script, Form Processing, Beginner Guides | | | Upload any fixed type of files, control file type through javascript and encrypt filename using php so file not get overwrite Categories : PHP, Java Script, Functions, PHP References, Form Processing | | | PHP Calendar Categories : PHP, Calendar, Date Time, Java Script, CSS | | | Balance values between two list boxes. Change the value of list box A acording to the value in list box B and vice versa using Javasvript. Categories : Java Script, Form Processing | | | CSS Buttons Styles Categories : CSS, HTML, Beginner Guides | | | Javascript animated menu items Categories : DHTML, CSS, Java Script, HTML | | | Local Time clock and Server time usign PHP and JavaScript Categories : PHP, Java Script, Date Time, Beginner Guides | | | Page Loading Message shown during the time your site's page is being loaded. Categories : HTML, CSS, Java Script | |
|
|