¿Cómo puedo verificar si un elemento es un elemento de lista desplegable o un elemento de entrada de texto, dado su id?

Question

En Javascript, dado el id de un elemento (en un formato String), ¿cómo puedo verificar si el id del elemento se refiere a un elemento de lista desplegable, o un elemento de entrada de texto?

La función debe devolver true si el id se refiere a una lista desplegable elemento (<select>), o un elemento de entrada de texto hacia abajo, y false lo contrario.

Answer 1

trate de usar: document.getElementById('idNameGoesHere').tagName

Así que la función podría ser:

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; 
} 

Usted podría ampliar este para comprobar si hay <textarea> y .

EDIT: O elegir jbabey de answer, ya que está utilizando nodeName y es mejor formato.

parecer nodeName has wider browser support.

Answer 2

Si ya ha incluido jQuery, puede utilizar the is function:

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

o tal vez

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

si quieres incluir el área de texto

o

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

(este devuelve verdadero si es un texto o un menú desplegable o una entrada que no es un botón).

Tiene toda la potencia de jquery selectors para adaptar su consulta a sus necesidades exactas.

Demostración: http://jsfiddle.net/ELuEJ/ (tratar de cambiar el html)

Answer 3

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

se puede retrive elemento DOM y luego comprobar la tagName

Answer 4

Puede utilizar los nodeName y type propiedades de los elementos DOM para determinar esto. No se requieren bibliotecas externas.

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

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

muestra de trabajo: http://jsfiddle.net/ytHQD/