Let us discuss some of the HTML Events Attributes:
1. oninput
2. onselect
3. onchange
4. onsubmit
5. onkeypress
6. onresize
Let us discuss it one by one
1. oninput - When an element get the user input, this attribute fires automatically.
This event will fire when the the value of input of textarea changes.
Example:
HTML:
<input type="text" id="example" oninput="example()">
<p id="exampleTxt"></p>
SCRIPT:
function example() {
var x = document.getElementById("example").value;
document.getElementById("exampleTxt").innerHTML = "Your Text: " + x;
}
2. onselect - When we select the text in the element, this attribute will be fired.
Example:
HTML:
<input type="text" value="Select Content" onselect="example()">
SCRIPT:
function example() {
alert("You have selected some content");
}
3. onchange - When we change the value of an element, onchange attribute fire.
Example:
HTML:
<select id="example" onchange="example()">
<option value="one">One
<option value="two">Two
<option value="three">Three
<option value="four">Four
</select>
<p id="exampleTxt"></p>
SCRIPT:
function myFunction() {
var x = document.getElementById("example").value;
document.getElementById("exampleTxt").innerHTML = "You Text: " + x;
}
4. onsubmit - When a form is submitted, this attribute is fired.
Example:
HTML:
<form action="example.asp" onsubmit="example()">
Enter name: <input type="text" name="name">
<input type="submit" value="Submit">
</form>
SCRIPT:
function example() {
alert("The form is submitted");
}
5. onkeypress - When the user presses a key (on the keyboard), this attribute is fired.
Example:
HTML:
<input type="text" onkeypress="example()">
SCRIPT:
function example() {
alert("Key is Pressed!!");
}
6. onresize - When the browser window is resized, this attribute is fired.
Example:
HTML:
<body onresize="example()">
SCRIPT:
function example() {
alert("You have re-size of the browser window!");
}
Hope this will help you.
0 Comment(s)