<input type="image">

Gli elementi <input> di tipo image vengono utilizzati per creare pulsanti di invio grafici, ovvero pulsanti di invio che assumono la forma di un'immagine anziché di testo.

Gli attributi di questo elemento includono gli attributi globali.

Valore

Gli elementi <input type="image"> non accettano attributi value. Il percorso dell'immagine da visualizzare è specificato nell'attributo src.

Attributi aggiungitvi

Oltre agli attributi condivisi da tutti gli elementi <input>, gli input image dei pulsanti supportano i seguenti attributi.

alt

L'attributo alt fornisce una stringa alternativa da utilizzare come etichetta del pulsante se l'immagine non può essere visualizzata (a causa di un errore, un programma utente che non può o è configurato per non mostrare le immagini, o se l'utente utilizza un dispositivo di lettura dello schermo). Se fornita, deve essere una stringa non vuota appropriata come etichetta per il pulsante.

Ad esempio, se hai un pulsante grafico che mostra un'immagine con un'icona e/o il testo dell'immagine "Accedi ora", dovresti anche impostare l'attributo alt su qualcosa come Login Now.

Funzionalmente, l'attributo alt su <input type="image"> funziona proprio come l'attributo alt sugli elementi <>img.

formaction

Una stringa che indica l'URL a cui inviare i dati. Questo ha la precedenza sull'attributo action dell'elemento <>form che possiede l'<>input.

Questo attributo è disponibile anche sugli elementi <input type="submit"> e <button>.

formenctype

Una stringa che identifica il metodo di codifica da utilizzare quando si inviano i dati del modulo al server. Ci sono tre valori consentiti:

application/x-www-form-urlencoded

Questo, il valore predefinito, invia i dati del modulo come una stringa dopo la codifica URL del testo utilizzando un algoritmo come encodeURI().

multipart/form-data

Utilizza l'API FormData per gestire i dati, consentendo l'invio dei file al server. È necessario utilizzare questo tipo di codifica se il modulo include elementi <input> di tipo file (<input type="file">)

text/plain

Testo normale; per lo più utile solo per il debug, quindi puoi facilmente vedere i dati che devono essere inviati.

Se specificato, il valore dell'attributo formenctype sovrascrive l'attributo action del modulo proprietario.

Questo attributo è disponibile anche sugli elementi <input type="submit"> e <button>.

formmethod

Una stringa che indica il metodo HTTP da utilizzare durante l'invio dei dati del modulo; questo valore sovrascrive qualsiasi attributo method fornito nel modulo proprietario. I valori ammessi sono:

get

Un URL viene costruito iniziando con l'URL fornito dall'attributo formaction o action, aggiungendo un punto interrogativo ("?"), quindi aggiungendo i dati del modulo, codificati come descritto da formenctype o l'attributo enctype del modulo. Questo URL viene quindi inviato al server utilizzando una richiesta get HTTP. Questo metodo funziona bene per moduli semplici che contengono solo caratteri ASCII e non hanno effetti collaterali. Questo è il valore predefinito.

post

I dati del modulo sono inclusi nel corpo della richiesta che viene inviata all'URL fornito dall'attributo formaction o action utilizzando una richiesta HTTP post. Questo metodo supporta dati complessi e file allegati.

dialog

Questo metodo viene utilizzato per indicare che il pulsante chiude la finestra di dialogo a cui è associato l'input e non trasmette affatto i dati del modulo.

Questo attributo è disponibile anche sugli elementi <input type="submit"> e <button>.

formnovalidate

Un attributo booleano che, se presente, specifica che il modulo non deve essere convalidato prima dell'invio al server. Questo sovrascrive il valore dell'attributo novalidate nel modulo proprietario dell'elemento.

Questo attributo è disponibile anche sugli elementi <input type="submit"> e <button>.

formtarget

Una stringa che specifica un nome o una parola chiave che indica dove visualizzare la risposta ricevuta dopo l'invio del modulo. La stringa deve essere il nome di un contesto di navigazione (ovvero una scheda, una finestra o <iframe>. Un valore specificato qui sovrascrive qualsiasi destinazione fornita dall'attributo target sul <form> proprietario di questo input.

Oltre ai nomi effettivi di schede, finestre o frame inline, ci sono alcune parole chiave speciali che possono essere utilizzate:

_self

Carica la risposta nello stesso contesto di navigazione di quello che contiene il modulo. Questo sostituirà il documento corrente con i dati ricevuti. Questo è il valore predefinito utilizzato se non ne viene specificato nessuno.

_blank

Carica la risposta in un nuovo contesto di navigazione senza nome. Si tratta in genere di una nuova scheda nella stessa finestra del documento corrente, ma può differire a seconda della configurazione dell'agente utente .

_parent

Carica la risposta nel contesto di navigazione padre di quello corrente. Se non esiste un contesto padre, si comporta come _self.

_top

Carica la risposta nel contesto di navigazione di primo livello; questo è il contesto di navigazione che è l'antenato più in alto del contesto corrente. Se il contesto corrente è il contesto più in alto, si comporta come _self.

Questo attributo è disponibile anche sugli elementi <input type="submit"> e <button>.

height

Un numero che specifica l'altezza, in pixel CSS, alla quale disegnare l'immagine specificata dall'attributo src.

src

Una stringa che specifica l'URL del file immagine da visualizzare per rappresentare il pulsante di invio grafico. Quando l'utente interagisce con l'immagine, l'input viene gestito come qualsiasi altro pulsante di input.

width

Un numero che indica la larghezza alla quale disegnare l'immagine, in pixel CSS.

Attributi obsoleti

Il seguente attributo è stato definito da HTML 4 per gli input di tipo image, ma non è stato implementato da tutti i browser e da allora è stato deprecato.

usemap

Se usemap è specificato, deve essere il nome di un elemento della mappa immagine, <map>, che definisce una mappa immagine da utilizzare con l'immagine. Questo utilizzo è obsoleto; dovresti passare all'uso dell'elemento <img> quando vuoi usare le mappe di immagini.

Liste utili

• Attributi
• Attributi globali
• Elementi