Come posso verificare se un elemento è un elemento dell'elenco a discesa o un elemento di immissione del testo, dato il suo id?

Question

In Javascript, dato il id di un elemento (in un formato String), come è possibile verificare se l'elemento id si riferisce a un elemento dell'elenco a discesa o a un elemento di immissione del testo?

La funzione deve restituire true se il id riferisce ad una lista di goccia elemento (<select>), o un elemento di input testo verso il basso, e false altrimenti.

Answer 1

provare a utilizzare: document.getElementById('idNameGoesHere').tagName

Quindi la funzione potrebbe essere:

function isSelectOrTextField(idName) { 
    var element = document.getElementById(idName); 
    if(element.tagName === 'SELECT') {return true;} 
    if(element.tagName === 'INPUT' && element.type === 'text') {return true;} 
    return false; 
} 

è possibile espandere questo per verificare la presenza di <textarea> pure .

EDIT: O scegliere jbabey di answer come è usando nodeName ed è meglio formattato.

apparentemente nodeName has wider browser support.

Answer 2

Se avete già jquery incluso, è possibile utilizzare the is function:

$('#myid').is('input, select') 

o forse

$('#myid').is('input, textarea, select') 

se si desidera includere anche textarea

o

$('#myid').is('input:not([type="button"]), textarea, select') 

(questo restituisce true se è un textare o un menu a discesa o un input che non è un pulsante).

Hai tutta la potenza di jquery selectors per adattare la query alle tue esigenze.

Dimostrazione: http://jsfiddle.net/ELuEJ/ (cercare di cambiare il codice HTML)

Answer 3

$('#myId')[0].tagName 

si può retrive l'elemento DOM e quindi controllare il tagName

Answer 4

È possibile utilizzare i nodeName e type proprietà degli elementi DOM per determinare questo. Non sono richieste librerie esterne.

var isSelectOrTextInput = function (element) { 
    var nodeName = element.nodeName; 

    return nodeName === 'SELECT' || 
     (nodeName === 'INPUT' && 
     element.type.toLowerCase() === 'text'); 
}; 

campione di lavoro: http://jsfiddle.net/ytHQD/