Uzyskaj typ elementu za pomocą jQuery

308

Czy za pomocą jQuery można znaleźć typ elementu za pomocą jQuery? Na przykład, czy element jest div, span, select lub input?

Na przykład, jeśli próbuję załadować wartości do listy rozwijanej za pomocą jQuery, ale ten sam skrypt może wygenerować kod do zestawu przycisków opcji, czy mogę utworzyć coś takiego:

$('.trigger').live('click', function () {
   var elementType = $(this).prev().attr(WHAT IS IT);
});

Biorąc pod uwagę listę rozwijaną z przyciskiem obok klasy wyzwalacza , moja elementTypezmienna powinna powrócić selectpo naciśnięciu przycisku.

Jamie Hartnoll
źródło
Czy potrafisz sformułować inaczej? co rozumiesz przez typ elementu?
Abdul Munim,
możliwy duplikat znalezienia typu elementu za pomocą jQuery
Felix Kling

Odpowiedzi:

558

Pobranie elementu typu jQuery:

var elementType = $(this).prev().prop('nodeName');

robiąc to samo bez jQuery

var elementType = this.previousSibling.nodeName;

Sprawdzanie określonego typu elementu:

var is_element_input = $(this).prev().is("input"); //true or false
adeneo
źródło
16
Pamiętaj tylko, że funkcja .prop () została dodana tylko w jQuery 1.6 - być może będziesz musiał zaktualizować używaną wersję!
xgretsch
Nie działał ze starą wersją jQuery 1.3.2, więc został zaktualizowany do najnowszej wersji i działał dobrze.
Damodar Bashyal
2
Można to poprawić, zmieniając „tagName” na „nodeName”, jak wspomniano tutaj .
Kyle Stoflet
1
@KyleStoflet - wygląda na to, że masz rację, nodeNameobsługuje więcej typów elementów, a obsługa IE5.5 nie powinna już stanowić problemu, więc nie widzę problemów z przejściem tagNamedo nodeNamepowyższej odpowiedzi. Oba będą działać dobrze dla elementów, a te drugie będą działać również na tekstowych węzłach, atrybutach itp.
adeneo
3
Działa, ale nieco się myliłem z powodu prev (), który jest specyficzny dla przykładowego kodu, o którym mowa. Zasadniczo$(this).is("input");
Fanky
56

możesz także użyć:

$("#elementId").get(0).tagName
Ali
źródło
26

powinieneś użyć tagNamewłaściwości i attr('type')do danych wejściowych

Distdev
źródło
Przykład wzmocniłby ten komentarz.
Justapigeon
16

Jak wspomniał Distdev, nadal musisz różnicować typ wejścia. To jest do powiedzenia,

$(this).prev().prop('tagName');

powie Ci input, ale to nie odróżnia pola wyboru / tekstu / radia. Jeśli jest to dane wejściowe, możesz użyć

$('#elementId').attr('type');

aby powiedzieć ci pole wyboru / tekst / radio, abyś wiedział, jaki to rodzaj kontroli.

James Toomey
źródło
9

możesz użyć .is():

  $( "ul" ).click(function( event ) {
      var target = $( event.target );
      if ( target.is( "li" ) ) {
         target.css( "background-color", "red" );
      }
  });

patrz źródło

Mohammed Sufian
źródło
3

Użyj Nodename zamiast tagName:

nodeName zawiera wszystkie funkcje tagName oraz kilka innych. Dlatego nodeName jest zawsze lepszym wyborem.

patrz DOM Core

Mike Rifgin
źródło