initial commit

1 files changed, 176 insertions, 0 deletions

diff --git a/files/it/web/api/event/preventdefault/index.html b/files/it/web/api/event/preventdefault/index.html
new file mode 100644
index 0000000000..040257b4a3
--- /dev/null
+++ b/files/it/web/api/event/preventdefault/index.html
@@ -0,0 +1,176 @@
+---
+title: Event.preventDefault()
+slug: Web/API/Event/preventDefault
+tags:
+  - DOM
+  - Gecko
+  - Reference_del_DOM_di_Gecko
+  - Tutte_le_categorie
+translation_of: Web/API/Event/preventDefault
+---
+<div>{{ ApiRef("DOM") }}</div>
+
+<p>Il metodo <code><strong>preventDefault()</strong></code> dell'interfaccia {{domxref("Event")}} dice all'{{Glossary("user agent")}} che se l'evento non viene esplicitamente gestito, la sua azione predefinita non dovrebbe essere presa come normalmente. L'evento continua a propagarsi come al solito, a meno che uno dei suoi listener di eventi non chiami {{domxref("Event.stopPropagation", "stopPropagation()")}} o {{domxref("Event.stopImmediatePropagation", "stopImmediatePropagation()")}}, uno dei due interrompa la propagazione contemporaneamente.</p>
+
+<h2 id="Sintassi">Sintassi</h2>
+
+<pre class="syntaxbox"><em>Event</em>.preventDefault();</pre>
+
+<h3 id="Parametri">Parametri</h3>
+
+<p>Nessuno.</p>
+
+<h3 id="Valore_di_ritorno">Valore di ritorno</h3>
+
+<p><code>undefined</code>.</p>
+
+<h2 id="Esempi">Esempi</h2>
+
+<h3 id="Blocco_della_gestione_dei_click_predefinita">Blocco della gestione dei click predefinita</h3>
+
+<p>La commutazione di una casella di controllo è l'azione predefinita di fare click su una casella di controllo. Questo esempio mostra come impedire che ciò accada:</p>
+
+<h4 id="JavaScript">JavaScript</h4>
+
+<pre class="brush: js">document.querySelector("#id-checkbox").addEventListener("click", function(event) {
+         document.getElementById("output-box").innerHTML += "Mi dispiace! &lt;code&gt;preventDefault()&lt;/code&gt; non ti lascerà controllare questo!&lt;br&gt;";
+         event.preventDefault();
+}, false);</pre>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">&lt;p&gt;Si prega di fare click sul controllo casella di controllo.&lt;/p&gt;
+
+&lt;form&gt;
+  &lt;label for="id-checkbox"&gt;Checkbox:&lt;/label&gt;
+  &lt;input type="checkbox" id="id-checkbox"/&gt;
+&lt;/form&gt;
+
+&lt;div id="output-box"&gt;&lt;/div&gt;</pre>
+
+<h4 id="Risultato">Risultato</h4>
+
+<p>Puoi vedere questo in azione qui:</p>
+
+<p>{{EmbedLiveSample("Blocking_default_click_handling")}}</p>
+
+<h3 id="Interruzione_delle_sequenze_di_tasti_per_raggiungere_un_campo_di_modifica">Interruzione delle sequenze di tasti per raggiungere un campo di modifica</h3>
+
+<p>L'esempio seguente dimostra come interrompere l'input di testo non valido per raggiungere il campo di input con <code>preventDefault()</code>. Al giorno d'oggi, di solito dovresti usare <a href="/it-US/docs/Learn/HTML/Forms/Form_validation">convalida del modulo HTML nativo</a>.</p>
+
+<h4 id="HTML_2">HTML</h4>
+
+<p>Ecco il modulo:</p>
+
+<pre class="brush: html">&lt;div class="container"&gt;
+  &lt;p&gt;Inserisci il tuo nome utilizzando solo lettere minuscole.&lt;/p&gt;
+
+  &lt;form&gt;
+    &lt;input type="text" id="my-textbox"&gt;
+  &lt;/form&gt;
+&lt;/div&gt;</pre>
+
+<h4 id="CSS">CSS</h4>
+
+<p>Usiamo un po' di CSS per la finestra di avviso che disegneremo quando l'utente preme una chiave non valida:</p>
+
+<pre class="brush: css">.warning {
+  border: 2px solid #f39389;
+  border-radius: 2px;
+  padding: 10px;
+  position: absolute;
+  background-color: #fbd8d4;
+  color: #3b3c40;
+}</pre>
+
+<h4 id="JavaScript_2">JavaScript</h4>
+
+<p>Ed ecco il codice JavaScript che fa il lavoro. Per prima cosa, ascolta gli eventi {{event("keypress")}}:</p>
+
+<pre class="brush: js">var myTextbox = document.getElementById('my-textbox');
+myTextbox.addEventListener('keypress', checkName, false);
+</pre>
+
+<p>La funzione <code>checkName()</code>, che controlla il tasto premuto e decide se permetterlo:</p>
+
+<pre class="brush: js">function checkName(evt) {
+  var charCode = evt.charCode;
+  if (charCode != 0) {
+    if (charCode &lt; 97 || charCode &gt; 122) {
+      evt.preventDefault();
+      displayWarning(
+        "Per favore usa solo lettere minuscole."
+        + "\n" + "charCode: " + charCode + "\n"
+      );
+    }
+  }
+}
+</pre>
+
+<p>la funzione <code>displayWarning()</code> presenta la notifica di un problema. Non è una funzione elegante ma fa il lavoro ai fini di questo esempio:</p>
+
+<pre class="brush: js">var warningTimeout;
+var warningBox = document.createElement("div");
+warningBox.className = "warning";
+
+function displayWarning(msg) {
+  warningBox.innerHTML = msg;
+
+  if (document.body.contains(warningBox)) {
+    window.clearTimeout(warningTimeout);
+  } else {
+    // inserisci warningBox dopo myTextbox
+    myTextbox.parentNode.insertBefore(warningBox, myTextbox.nextSibling);
+  }
+
+  warningTimeout = window.setTimeout(function() {
+      warningBox.parentNode.removeChild(warningBox);
+      warningTimeout = -1;
+    }, 2000);
+}</pre>
+
+<h4 id="Risultato_2">Risultato</h4>
+
+<p>Ecco il risultato del codice precedente:</p>
+
+<p>{{ EmbedLiveSample('Stopping_keystrokes_from_reaching_an_edit_field', 600, 200) }}</p>
+
+<h2 id="Note">Note</h2>
+
+<p>Chiamando <code>preventDefault()</code> durante qualsiasi fase del flusso di eventi annulla l'evento, il che significa che non verrà eseguita alcuna azione predefinita normalmente eseguita dall'implementazione come risultato dell'evento.</p>
+
+<div class="note">
+<p>A partire da {{Gecko("6.0")}}, chiamare <code>preventDefault()</code>  fa sì che il valore della proprietà {{ domxref("Event.defaultPrevented()") }} diventi <code>true</code>.</p>
+</div>
+
+<p>Puoi utilizzare {{domxref("Event.cancelable")}} per verificare se l'evento è cancellabile. Chiamare <code>preventDefault()</code> per un evento non cancellabile non ha alcun effetto.</p>
+
+<h2 id="Specifications" name="Specifications">Specifiche</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specifica</th>
+   <th scope="col">Stato</th>
+   <th scope="col">Commento</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-preventdefault', 'Event.preventDefault()')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events', '#Events-Event-preventDefault', 'Event.preventDefault()')}}</td>
+   <td>{{ Spec2('DOM2 Events') }}</td>
+   <td>Definizione iniziale.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilità_con_i_browser">Compatibilità con i browser</h2>
+
+
+
+<p>{{Compat("api.Event.preventDefault")}}</p>