<p id="output"></p>
<script>
function onFocusFunction()
[Link]("output").innerHTML = "The input field has focus.";
function onBlurfunction()
[Link] ById("output").innerHTML *The input field lost focus.";
function onSelectF unction() €
[Link] ("output").innertTML"Text as selected in the input field.";
function onChangeFunction() {
[Link] ById("output").innerHTML = "The value of the form element has changed.";
function onColorChangeFunc tion() {
I Get the selected color from the dropdown
var selectedColor - docunent..getElementBy Id("color").value;
1 Change the background color of the body based on the selected color
[Link]. backgroundColor =
selectedColor;
II Change the font color based on the selected background color
if (selectedColor rgb(117, 1, 5)" ||selectedColor "blue || selectedColor "reen") (
docunent..[Link] "white"; 0 Set font color to white
} else {
[Link] = ""; II Reset font color to default
II Display the selected color in the output
[Link] ById("cutput").innerHTHL = "Background color changed to "+ selectedColor +".";
</script>
</body>
</html>
<DOCTYPE html>
<html lang="en">
<head>
cmeta charset="UTF-8">
cmeta name ="viewport" content="width=device-width,
initial-scale=1.
0">
<title>Form Events/title>
</head>
<body>
ch3tlane:SHAIKH ANIQUE</h3
<h3>Rollno: 32</n3>
<h3>EnrolIment No: 2205690098</m3>
<h3>ranch: AIL</3>
<h2>7. Create a Webpage to implement form events. part-1</h2>
<h3>The form events in JavaScript are associated with HTML forms.</h3>
<p>These events are triggered by user actions when interacting with fore elements like text fields, buttons, checkboxes, etc.</p>
<h3>onselect:</h3>
<p>js runs this event when an element is selected.</p>
<h3>onblur:</h3)
<p>Triggered when an element loses focus, such as when a user clicks outside an input field or tabs away.</p>
<h3>onfocus:</h3)
<p>Triggered shen an element receives focus, such as when a user clicks or tabs into an input field.</p>
<h3>onchange:</h3>
<p>Triggered when the value of a form element (input, select, textarea) changes.</p>
<form>
Nane: <input type="text" id="name" onfocus="onFocusFunction() onblur="onBlurFunction()"onselect="onSele ctFunction()"Xbrxbr>
Age: <input type="text" id="age" onchange="onChangeFunction()"xbr><br>
Address: <input type="text" id="address"><brxbr>
<label for="color">SelectBackground Color: </label>
<select id="color" onchange="onColorCh angeFunction()">
<option value="">-Select--</option>
<option value="rgb(117, 1, 5)">Red</option>
<option value="blue"> Blue</option>
<option value"green ">Greens/option>
<option value="yellow">Yellow< /option>
</select
</form>
Name: SHAIKHANIQUE
Roll no: 32
Enrollment No: 2205690098
Branch: AIML
7. Create a Webpage to implement form events. part-1
The form events in JavaScript are associated with HTML forms.
These events are triggered by user actions when interacting with form elements like text fields, buttons, checkboxes, etc.
onselect:
js runs this event when an element is selected.
onblur:
Triggered when an element loses focus, such as when a user clicks outside an input field or tabs away.
onfocuS:
Triggered when an element receives focus, such aswhen a user clicks or tabs into an input field.
onchange:
Triggered when the value ofa fom element (input, select, textarea) changes.
Name:
Age
Address:
Select Background Color: Red
Background color changed to rgb(117, 1, 5).