Event in JavaScript Using PHP

Vinod Kumar
11y
7.5k
0
0

Article

Introduction

This article explains events in JavaScript using PHP. I explain this tutorial using JavaScript events and find X-axis and Y-axis values. This is a very interesting example in this article. You can easily find the X-axis and Y-axis values. Now let's proceed to how to use it.

Example

First of all you will create two text boxes to use HTML and the next one is to create a JavaScript function in the head section. You can see the function below for moving the X-axis and Y-axis values. Move both text box values using the "onmousemove" event.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Event in JavaScript</title>

document.onmousemove = call;

function call(evnt)
{

document.getElementById("x").value = evnt.clientX;

document.getElementById("y").value = evnt.clientY;

}

</script>

</head>

<body>

<form>

X axis:<input type="text" id="x"><br/>

Y axis:<input type="text" id="y">

</form>

</body>

</html>

The most proper way to do this is to make the HTML and JavaScript files separate. You can create the JavaScript file with the name "event.js".

document.onmousemove=call;

function call(evnt)

{

document.getElementById("x").value=evnt.clientX;

document.getElementById("y").value=evnt.clientY;

}

And this is your HTML file saved with the "form.js" name. This is a proper way to work with both files separate. Sometimes this does not work in Internet Explorer;if so then you can write this code:

That does not use "evnt" it uses "event". Then to do it the proper way you three measure browser Mozilla Firefox, Google chrome, and Internet Explorer.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">