Scribd
Upload
17 views7 pages

7h Css

The document describes different client-side scripting events like onclick, ondblclick, onfocus, onsubmit, and onmouseover using HTML and JavaScript. It provides code examples to demonstrate each event and their expected output.

Uploaded by

Ganesh Ekambe
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
17 views7 pages

7h Css

The document describes different client-side scripting events like onclick, ondblclick, onfocus, onsubmit, and onmouseover using HTML and JavaScript. It provides code examples to demonstrate each event and their expected output.

Uploaded by

Ganesh Ekambe
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/ 7

Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07
Code.
1. Onclick Event

<!DOCTYPE html>
<html>
<head>
<h1> on click event</h1>
</head>
<body>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<br>

<label for="email">Email:</label>
<input type="email" id="email" name="email">
<br>

<button type="button" id="submitButton"


onclick="submitForm()">Submit</button>
</form>

<script>
function submitForm() {

var name = document.getElementById("name").value;


var email = document.getElementById("email").value;

if (name === "" || email === "") {


alert("Please fill in all fields.");
} else {

alert("Name: " + name + "\nEmail: " + email);


}
}
</script>
</body>
</html>
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07

Output
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07

2. Doble click Event

<!DOCTYPE html>
<html >
<head>
<h1> Double Click Event </h1>
<script>
function handleDoubleClick() {
alert("Button double-clicked example Performed by: Ganesh
Ekambe");
}
</script>
</head>
<body>
<form>
<button type="button" ondblclick="handleDoubleClick()">Double
Click Me</button>
</form>
</body>
</html>

Output
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07

3. Text Event

<html>
<head>
<h2> Text Event : focus</h2>
</head>
<body>
<h2> Enter something here</h2>
<input type="text" id="input1" onfocus="focusevent()"/>
<script>

function focusevent()
{
document.getElementById("input1").style.background="
aqua";
}

</script>
</body>
</html>

Output
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07
4. Swapping:

<!DOCTYPE html>
<html>
<head>
<h1> Swapping Event </h1>
</head>
<body>
<form id="swapForm">
<label for="input1">Input 1:</label>
<input type="text" id="input1" name="input1" required><br>

<label for="input2">Input 2:</label>


<input type="text" id="input2" name="input2" required><br>

<input type="submit" value="Swap Values">


</form>

<script>
document.getElementById("swapForm").addEventListener("submit",
function(event) {
event.preventDefault();

var input1Value = document.getElementById("input1").value;


var input2Value = document.getElementById("input2").value;
var temp = input1Value;
input1Value = input2Value;
input2Value = temp;

document.getElementById("input1").value = input1Value;
document.getElementById("input2").value = input2Value;
});
</script>
</body>
</html>
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07

Output

After Swapping
Client side Scripting Language (22519)

Name of Student: Ekambe Ganesh Roll No.: 53


Practical No. 07
5. On mouse over

<html>
<head>
<h1> Javascript Events </h1>
</head>
<body>
<script language="Javascript" type="text/Javascript">
<!--
function mouseoverevent()
{
alert("This is Java");
}
//-->
</script>
<p onmouseover="mouseoverevent()"> Keep cursor over
me</p>
</body>
</html>

Output

You might also like