Как я могу определить тип элемента соответствующего элемента в jQuery?

Question

Я сопоставляю сгенерированные ASP.Net элементы по имени ID, но у меня есть некоторые элементы, которые могут отображаться как текстовые поля или метки в зависимости от контекста страницы. Мне нужно выяснить, соответствует ли это текстовое поле или метка, чтобы узнать, получать ли содержимое с помощью val () или html ().

$("[id$=" + endOfIdToMatch + "]").each(function () {
    //determine whether $(this) is a textbox or label
    //do stuff
});

Я нашел решение, которое не работает, оно просто возвращает "undefined":

$("[id$=" + endOfIdToMatch + "]").each(function () {
    alert($(this).tagName);
});

Чего мне не хватает?

Answer 1

Только один JQuery слишком много:

$("[id$=" + endOfIdToMatch + "]").each(function () {
    alert(this.tagName);
});

Answer 2

Рассмотрим это решение без использования каждая () :

var elements = $("[id$=" + endOfIdToMatch + "]");
var vals = elements.is("input").val();
var htmls = elements.is("label").html();
var contents = vals.concat(htmls);

Посмотрите документацию для is .

Answer 3

Вы также можете использовать что-то вроде этого:

if ($(this).is('input:checkbox'))

замените "this" любым нужным вам экземпляром, а "checkbox" - любым нужным вам типом ввода.

Answer 4

Впервые я ответил на свой вопрос. После еще нескольких экспериментов:

$("[id$=" + endOfIdToMatch + "]").each(function () {
   alert($(this).attr(tagName));
});

работает! * * 1004

Answer 5

в jquery 1.6 используйте prop ()

Пример

var el = $('body');

if (el.prop('tagName') === 'BODY') {
    console.log('found body')
}

Answer 6

tagName, что хороший совет. Я также хотел бы предложить использовать tagName.toLowerCase (), поскольку возвращаемое значение зависит от типа документа (HTML или XML / XHTML).

См .: http://reference.sitepoint.com/javascript/Element/tagName

Answer 7

$("[id$=" + endOfIdToMatch + "]").each(function(){
    var $this=jQuery(this),ri='';
    switch (this.tagName.toLowerCase()){
        case 'label':
            ri=$this.html();
            break;
        case 'input':
            if($this.attr('type')==='text'){ri=$this.val();}
            break;
        default:
            break;
    }
    return ri;
})

Вопрос в том, что вы собираетесь делать после того, как определили имя тега? Вы также можете легко отфильтровать список jquery, используя дополнительный селектор в сочетании с .end (), чтобы сделать то же самое:

$("[id$=" + endOfIdToMatch + "]")
    .find("input:text")
    .each(function(){
         /* do something with all input:text elements */
    })
    .end()
    .find("label")
    .each(function(){
        /* do something with label elements */
    })
    .end()

Это все еще может быть приковано цепью, если вам нужно сделать что-то еще с этим конкретным набором элементов ... так же, как в примере выше.

В любом случае вам придется что-то делать со значениями внутри операторов each()

Answer 8

Это лучший способ получить тип элемента

function tgetelementType( elmentid )
{

    var TypeName = $('#' + elmentid).get(0).tagName;
    var TypeName2 = $('#' + elmentid).get(0).type;


    if($('#' + elmentid).get(0).tagName== "INPUT")
    {
       return $('#' + elmentid).get(0).type.toUpperCase()
    }
    else 
    {
        return $('#' + elmentid).get(0).tagName.toUpperCase() ; 
    }
}

Answer 9

Еще одно решение, возможно, более элегантное, заключается в написании двух отдельных функций для каждого типа элемента:

$("input#" + id).each(function() { alert(this + " is an input"); });
$("label#" + id).each(function() { alert(this + " is a label"); });