Scribd
Upload
9 views6 pages

Exp 7

This document contains details about a client side scripting course including the course code, semester, class, laboratory number, name of the subject teacher and student. It describes an experiment to create a webpage to implement form events. It includes sample code to demonstrate mouse events using buttons and practical and exercise questions related to JavaScript functions, events, dynamic option lists, and automatically generating an email from entered names.

Uploaded by

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

Exp 7

This document contains details about a client side scripting course including the course code, semester, class, laboratory number, name of the subject teacher and student. It describes an experiment to create a webpage to implement form events. It includes sample code to demonstrate mouse events using buttons and practical and exercise questions related to JavaScript functions, events, dynamic option lists, and automatically generating an email from entered names.

Uploaded by

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

Course: Client Side Scripting Course Code: 22516

Semester: V Class: CO5IA

Laboratory No: Name of Subject Teacher: Omkar


Birmole
Name of Student: Durgesh Khade Roll ID: 18203A0048

Experiment No. 07

Title of Experiment Create a webpage to implement form events. Part 1

Program: Computer Engineering


Program Code:
<html>
<head>
<title>Mouse Events</title>
</head>
<body>
<h2>Following are the Mouse Events</h2>
<input type="button" name="btn1" onmouseover="alert('You pointed your
mouse on the Button');"
value="Hover mouse on me"><br><br>
<input type="button" name="btn2" onmouseout="alert('You pointed your
mouse
out of the Button');"
value="Hover out of me"><br><br>
<input type="button" name="btn3" onclick="alert('You left-clicked on the
Button');"
value="Left-click on me"><br><br>
<input type="button" name="btn4" oncontextmenu="alert('You right-clicked
on the Button');"
value="Right-click on me"><br><br>
</body>
</html>
Practical Related Questions:
1) Explain Java Intrinsic functions.
Ans:
Java intrinsic functions are built-in functions that are available in the Java
programming language. These functions are provided by the Java runtime
environment and can be directly invoked without the need for any additional
setup or import statements.
Examples of Java intrinsic functions include System.out.println() for printing
output to the console, Math.random() for generating random numbers, and
String.length() for finding the length of a string.

2) Write the events which are used checkbox and buttons.


Ans:
Checkbox and button elements in HTML can trigger various events. Some of
the commonly used events for checkboxes include:
- onchange: Fires when the checkbox value is changed.
- onclick: Fires when the checkbox is clicked.
- onfocus: Fires when the checkbox receives focus.
- onblur: Fires when the checkbox loses focus.

For buttons, commonly used events include:


- onclick: Fires when the button is clicked.
- onmouseover: Fires when the mouse pointer is moved over the button.
- onmouseout: Fires when the mouse pointer is moved away from the button.
- onfocus: Fires when the button receives focus.
- onblur: Fires when the button loses focus.
3) Explain the use of with keyword in javascript.
Ans: The "with" keyword in JavaScript is used to create a temporary scope
where properties and methods of an object can be accessed directly without
having to specify the object name each time. It is generally considered a bad
practice to use the "with" keyword, as it can lead to code ambiguity and
performance issues. The "with" statement has been deprecated in modern
JavaScript versions and is not recommended for use.

4) What is the use of oncontextmenu event?


Ans: The "oncontextmenu" event is triggered when a user right-clicks on an
element in a web page. It is commonly used to display a context menu or
perform specific actions when the right mouse button is clicked.
By capturing the "oncontextmenu" event, developers can prevent the default
browser context menu from appearing and instead implement their own
custom behavior.
This event can be handled using JavaScript to perform actions such as
displaying a custom menu, showing a tooltip, or executing a specific function.
Exercise Questions:
1) Write a program for changing the option list
dynamically.
<html>
<html>
<head>
<title>Dynamic Option List</title>
</head>
<body>
<select id="selectList" onchange="updateOptions()">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<select id="optionList"></select>
<script>
function updateOptions() {
var selectList = document.getElementById("selectList");
var selectedValue = selectList.value;
var optionList = document.getElementById("optionList");
while (optionList.firstChild) {
optionList.removeChild(optionList.firstChild);
}
if (selectedValue === "1") {
optionList.add(new Option("Option A", "A"));
optionList.add(new Option("Option B", "B"));
optionList.add(new Option("Option C", "C"));
} else if (selectedValue === "2") {
optionList.add(new Option("Option X", "X"));
optionList.add(new Option("Option Y", "Y"));
optionList.add(new Option("Option Z", "Z"));
} else if (selectedValue === "3") {
optionList.add(new Option("Option Apple", "Apple"));
optionList.add(new Option("Option Banana", "Banana"));
optionList.add(new Option("Option Orange", "Orange"));
}
}
</script>
</body>
</html>
2) Develop a program for as we enter the firstname and lastname, email
is automatically generated.
<html>
<head>
<title>Email Generator</title>
</head>
<body>
<label for="firstName">First Name:</label>
<input type="text" id="firstName" oninput="generateEmail()" />
<label for="lastName">Last Name:</label>
<input type="text" id="lastName" oninput="generateEmail()" />
<label for="email">Email:</label>
<input type="text" id="email" readonly />
<script>
function generateEmail() {
var firstName = document.getElementById("firstName").value;
var lastName = document.getElementById("lastName").value;
var email = firstName.toLowerCase() + "." +
lastName.toLowerCase() + "@example.com";
document.getElementById("email").value = email;
}
</script>
</body>
</html>

You might also like