The interaction of javascript with HTML is carried out through events, an event occurs when the user interacts with browser page.
List of javascript events:
Examples : onClick Event and here I am using internal javascript(embedded with HTML).
Demo 1
Code for above demo 1:
Example: onKeypress Event.
Demo 2
Code for above demo 2:
List of JavaScript events:
List of javascript events:
Examples : onClick Event and here I am using internal javascript(embedded with HTML).
Demo 1
| UserName : | |
| Password : | |
Code for above demo 1:
<!DOCTYPE html>
<head>
<script>
function Validate() {
var nameVal = document.getElementById("nameText").value;
var passVal = document.getElementById("passText").value;
if(nameVal=="" || passVal=="") {
alert("Name or password can't be Emplty");
}
else {
alert("Name : "+nameVal+"\nPassword : "+passVal);
}
}
</script>
</head>
<body>
<table>
<tbody>
<tr>
<td>UserName :</td>
<td><input id="nameText" type="text" /></td>
</tr>
<tr>
<td>Password :</td>
<td><input id="passText" type="password" /></td>
</tr>
<tr>
<td></td>
<td><input onclick="Validate()" type="submit" value="Submit" /></td>
</tr>
</tbody>
</table>
</body>
</html>
<head>
<script>
function Validate() {
var nameVal = document.getElementById("nameText").value;
var passVal = document.getElementById("passText").value;
if(nameVal=="" || passVal=="") {
alert("Name or password can't be Emplty");
}
else {
alert("Name : "+nameVal+"\nPassword : "+passVal);
}
}
</script>
</head>
<body>
<table>
<tbody>
<tr>
<td>UserName :</td>
<td><input id="nameText" type="text" /></td>
</tr>
<tr>
<td>Password :</td>
<td><input id="passText" type="password" /></td>
</tr>
<tr>
<td></td>
<td><input onclick="Validate()" type="submit" value="Submit" /></td>
</tr>
</tbody>
</table>
</body>
</html>
Example: onKeypress Event.
Demo 2
Code for above demo 2:
<!DOCTYPE html>
<head>
<script>
function hit() {
alert("key is pressed in side the textArea");
}
</script>
</head>
<body>
<textarea onkeypress="hit()"></textarea>
</body>
</html>
<head>
<script>
function hit() {
alert("key is pressed in side the textArea");
}
</script>
</head>
<body>
<textarea onkeypress="hit()"></textarea>
</body>
</html>
| Event | Value | Description |
|---|---|---|
| onchange | script | Script runs when the element changes |
| onsubmit | script | Script runs when the form is submitted |
| onreset | script | Script runs when the form is reset |
| onselect | script | Script runs when the element is selected |
| onblur | script | Script runs when the element loses focus |
| onfocus | script | Script runs when the element gets focus |
| onkeydown | script | Script runs when key is pressed |
| onkeypress | script | Script runs when key is pressed and released |
| onkeyup | script | Script runs when key is released |
| onClick | script | Script runs when a mouse click |
| ondblclick | script | Script runs when a mouse double-click |
| onmousedown | script | Script runs when mouse button is pressed |
| onmousemove | script | Script runs when mouse pointer moves |
| onmouseout | script | Script runs when mouse pointer moves out of an element |
| onmouseover | script | Script runs when mouse pointer moves over an element |
| onmouseup | script | Script runs when mouse button is released |
No comments:
Post a Comment