Definition and Usage..
The ondblclick event occurs when the user double-clicks on an element.
Syntax :
In HTML: <element ondblclick="myScript">
In JavaScript: object.ondblclick = function(){myScript};
In JavaScript, using the addEventListener() method:
object.addEventListener("dblclick", myScript);
The ondblclick event occurs when the user double-clicks on an element.
Syntax :
In HTML: <element ondblclick="myScript">
In JavaScript: object.ondblclick = function(){myScript};
In JavaScript, using the addEventListener() method:
object.addEventListener("dblclick", myScript);
<!DOCTYPE html>
<html>
<body>
<p id="p">Double-click me.
This example uses the HTML DOM to assign an "ondblclick" event to a p element.</p>
<button id="bu1" ondblclick="dbl()" onclick="click1()">Click ME!</button>
<button id="bu2" onclick="click2()">Double Click for COLOR</button>
<script>
document.getElementById("p").ondblclick = function() {myFunction()};
function myFunction() {
document.getElementById("p").style.border="1pt solid gray";
}
function click1() {
document.getElementById("bu1").innerHTML = "FAST Click ME AGAIN";
}
function dbl() {
document.getElementById("bu1").innerHTML = "Perfect Double Click ME!";
}
function click2() {
document.getElementById("bu2").style.border="4pt solid lightgreen";
}
document.getElementById("bu2").addEventListener("dblclick", changeColor);
function changeColor() {
document.getElementById("bu2").style.backgroundColor="lightgreen";
}
</script>
</body>
</html>
<html>
<body>
<p id="p">Double-click me.
This example uses the HTML DOM to assign an "ondblclick" event to a p element.</p>
<button id="bu1" ondblclick="dbl()" onclick="click1()">Click ME!</button>
<button id="bu2" onclick="click2()">Double Click for COLOR</button>
<script>
document.getElementById("p").ondblclick = function() {myFunction()};
function myFunction() {
document.getElementById("p").style.border="1pt solid gray";
}
function click1() {
document.getElementById("bu1").innerHTML = "FAST Click ME AGAIN";
}
function dbl() {
document.getElementById("bu1").innerHTML = "Perfect Double Click ME!";
}
function click2() {
document.getElementById("bu2").style.border="4pt solid lightgreen";
}
document.getElementById("bu2").addEventListener("dblclick", changeColor);
function changeColor() {
document.getElementById("bu2").style.backgroundColor="lightgreen";
}
</script>
</body>
</html>
Comments
Post a Comment