Scribd
Upload
34 views

CSS Pract-8

Uploaded by

rathodharshalr1905
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
34 views

CSS Pract-8

Uploaded by

rathodharshalr1905
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Practical No-8: Create web page to implement Form Events.

Part II

Code-1: Onload event

<html>

<head>

<script type="text/javascript">

function sayHello() {

alert("Hello World!")

</script>

</head>

<body>

<p>Click the button to see result</p>

<form>

<input type="button" onclick="sayHello()" value="Say Hello" />

</form>

</body>

</html>

Output:
Code-2:

<html>

<body>

<button id="btn">Click here</button>

<p id="para" onmouseover="mouseOver()" onmouseout="mouseOut()">Hover over this Text !</p>

<b id="output"></b>

<script>

var x = document.getElementById("btn");

x.addEventListener("click", btnClick);

function mouseOver() {

document.getElementById("output").innerHTML += "MouseOver Event" + "<br>";

function mouseOut() {

document.getElementById("output").innerHTML += "MouseOut Event" + "<br>";

function btnClick() {

document.getElementById("output").innerHTML += "Click Event" + "<br>";

</script>

</body>

</html>
Output:

Code-3:

<html>

<head>

<script>

function changeColor(color)

var panel = document.getElementById('panel')

document.body.style.backgroundColor = color

panel.innerHTML = "Background color is set to: " + color.toUpperCase()

</script>

</head>

<body onload="changeColor('red')">

<p>Select option to change background color of page</p>

<form name="myform">
<input type="radio" name="color" value="red" onchange="changeColor(this.value)"
checked="false">RED<br />

<input type="radio" name="color" value="green"


onchange="changeColor(this.value)">GREEN<br />

<input type="radio" name="color" value="blue" onchange="changeColor(this.value)">BLUE<br />

</form>

<p id="panel"></p>

</body>

</html>

Output:
Code-4:

You might also like