JavaScript Events – Tutorialpath

Hello to all of you, thanks for landing on the TutorialPath.com, which is “Your Path to Learn Everything” in an easy way and you can learn almost every sort of important elements about online things. As you land here, so we can assume, you are a newbie for JavaScript Events language, so you don’t need to worry about it.

JavaScript Events Welcome to all our readers on our website at www.tutorialpath.com. As you all know that here on our website we will provide you lots of information related to the latest and newly introduced technology which helps you to get updated with the latest tech. Here you will get all the useful information which is required in this tech world.

JavaScript events

JavaScript Events

JavaScript has events to provide a dynamic interface to a webpage. These events are associated with elements of the Document Object Model (DOM).

When the page loads, it is called an event. When the user clicks a button, that click is also an event. Another examples include events such as pressing any key, closing a window, resizing a window, etc.

For example, When a user clicks on the browser, add js code, which will execute the task to be performed on the event.

There are some javascript events:

Mouse events:

Event Performed Event Handler Description
click onclick When mouse click on an element
mouseover onmouseover When the mouse cursor comes over the element
mouseout onmouseout When the mouse cursor leaves an element
mousedown onmousedown When the mouse button is pressed on the element
mouseup onmouseup When the mouse button is released on the element
mousemove onmousemove When mouse movement occurs.

Keyboard events:

Event Performed Event Handler Description
Keydown & Keyup onkeydown & onkeyup When the user presses and then releases the key

Form events:

Event Performed Event Handler Description
focus onfocus When the user focuses on an element
submit onsubmit When the user submits the form
blur onblur When the focus is away from an element
change onchange When the user modifies or changes the value of the form element

 1. onclick Event:

                       This is the most commonly used event type that occurs when a user clicks the left button of their mouse. You can keep your recognition,                            warnings etc. against this type of event.

Example:

<html>
<head> Javascript Events </head>
<body>
<script language=”Javascript” type=”text/Javascript”>
<!–
function clickevent()
{
document.write(“This is Tutorialpath”);
}
//–>
</script>
<form>
<input type=”button” onclick=”clickevent()” value=”Who’s this?”/>
</form>
</body>
</html>

Output:

This is Tutorialpath

2. onsubmit Event:

                    onsubmit is an event that occurs when you try to submit a form. You can put your form validation against this event type.

Example:

<html>
<head><script type = “text/javascript”>
<!–
function over() {
document.write (“Mouse Over”);
}function out() {
document.write (“Mouse Out”);
}//–>
</script></head>
<body>
<p>Bring your mouse inside the division to see the result:</p>

<div onmouseover = “over()” onmouseout = “out()”>
<h2> This is inside the division </h2>
</div>

</body>
</html>

Output:

Bring your mouse inside the division to see the result:

This is inside the division

3. onmouseover event:

This event corresponds to hovering the mouse pointer over the element and its children, to which it is bound to.

Example:

<!doctype html>

<html>

<head>

<script>

function hov() {

var e = document.getElementById(‘hover’);

e.style.display = ‘none’;

}

</script>

</head>

<body>

<div id=”hover” onmouseover=”hov()”

style=”background-color:green;height:200px;width:200px;”>

</div>

</body>

</html>

 

Output:

Before mouse is taken over green square-

4. onmouseout event:

                      Whenever the mouse cursor leaves the element which handles a mouseout event, a function associated with it is executed.

Example:

<html>

<head>

<script>

function out() {

var e = document.getElementById(‘hover’);

e.style.display = ‘none’;

}

</script>

</head>

<body>

<div id=”hover” onmouseout=”out()”

style=”background-color:green;height:200px;width:200px;”>

</div>

</body>

</html>

Output:

Before mouse is taken over the green square-

Conclusion

So, hopefully, we have shared all the basic steps that help you with JavaScript Events.  PHP extract the last character from a string. In this tutorial, you have several ways for PHP to remove the last character from any given strings.

Leave a Reply

Your email address will not be published. Required fields are marked *

//azoaltou.com/afu.php?zoneid=3461279