Event
|
Description
|
onchange
|
An HTML element has been changed
|
onclick
|
The user clicks an HTML element
|
onmouseover
|
The user moves the mouse over an HTML element
|
onmouseout
|
The user moves the mouse away from an HTML element
|
onkeydown
|
The user pushes a keyboard key
|
onload
|
The browser has finished loading the page
|
JavaScript Event:
(1)Example 1 onclick event save onclick.html:
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display the date.</p>
<button onclick="displayDate()">The time is?</button>
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
</body>
</html>
(2)Example 2 on onload Event save file onload.html:
<!DOCTYPE html>
<html>
<body onload="displayDate()">
<p>Click the button to display the date.</p>
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
</body>
</html>
(3)Example 3 onmouseover save file as onmouseover.html:
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display the date.</p>
<button onmouseover="displayDate()">The time is?</button>
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
</body>
</html>
(4)Example 4 on onchange event SAVE file onchange.html:
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display the date.</p>
<select name=city onchange="displayDate()">
<option value=mumbai> Mumbai</option>
<option value=delhi>Delhi</option>
</select>
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
</body>
</html>
(5)Example 5 onkeydown event save file as onkeydown.html:
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display the date.</p>
<input type=text name=name onkeydown="displayDate()">
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
</body>
</html>
Great post share by you thanks...
ReplyDeleteEtoile Info Solutions is a known and famous Web Development Company in Phoenix Arizona. Their experienced staff members are capable of processing innovative and creative technologies to improve their business online. They are proficient in providing effective and result driven search engine optimization solutions to improve your business visibility among the audience.