fare clic su Evento
Esempio
Esegui un JavaScript quando si fa clic su un pulsante:
<button onclick="myFunction()">Click me</button>
Definizione e utilizzo
L' onclick
evento si verifica quando l'utente fa clic su un elemento.
In HTML:
<element onclick="myScript">
In JavaScript:
object.onclick = function(){myScript};
In JavaScript, utilizzando il metodo addEventListener():
object.addEventListener("click", myScript);
Dettagli tecnici
Bolle: | sì |
---|---|
Annullabile: | sì |
Tipo di evento: | MouseEvent |
Tag HTML supportati : |
Tutti tranne: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> e <title> |
Altri esempi
Fare clic su un <pulsante> per visualizzare la data:
<button onclick="getElementById('demo').innerHTML = Date()">What is the time?</button>
Fare clic su un elemento <h3> per modificare il colore del testo:
<h3 id="demo" onclick="myFunction()">Click me to change my color.</h3>
<script>
function myFunction() {
document.getElementById("demo").style.color = "red";
}
</script>
Un altro esempio su come cambiare il colore di un elemento:
<h3 onclick="myFunction(this, 'red')">Click me to change my color.</h3>
<script>
function myFunction(element, color) {
element.style.color = color;
}
</script>
Fare clic per copiare il testo da un campo di input all'altro:
<button onclick="myFunction()">Copy Text</button>
<script>
function myFunction() {
document.getElementById("field2").value =
document.getElementById("field1").value;
}
</script>
Come assegnare un evento "onclick" all'oggetto finestra:
window.onclick = myFunction;
function myFunction() {
document.getElementsByTagName("BODY")[0].style.backgroundColor = "yellow";
}
Usa onclick per creare un menu a discesa:
document.getElementById("myBtn").onclick = function() {myFunction()};
function myFunction() {
document.getElementById("myDropdown").classList.toggle("show");
}
Pagine correlate
Esercitazione JavaScript: Eventi JavaScript
Riferimento HTML DOM: evento ondblclick
Riferimento HTML DOM: evento onmousedown
Riferimento HTML DOM: evento onmouseup
Supporto browser
onclick
è una funzionalità DOM di livello 2 (2001).
È completamente supportato in tutti i browser:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |