Wie Eingangstyp mit Jquery erhalten?

Question

Ich habe eine Seite, auf der der Eingabetyp immer variiert, und ich muss die Werte abhängig vom Eingabetyp abrufen. Also, wenn der Typ ein Radio ist, muss ich bekommen, was überprüft wird, und wenn es ein Kontrollkästchen ist, muss ich jetzt, die überprüft werden, und wenn es ein Dropdown ist, muss ich wissen, welche ausgewählt ist, und ich, wenn es ist ein text/textarea Ich muss die Werte kennen.

Irgendeine Idee, wie man das macht?

Answer 1

EDIT 1. Februar 2013. Aufgrund der Beliebtheit dieser Antwort und die Änderungen an jQuery in der Version 1.9 (und 2.0) in Bezug auf Eigenschaften accound und Attribute I hinzugefügt einige Notizen und eine Geige, um zu sehen, wie es beim Zugriff auf Eigenschaften/Attribute auf Eingabe, Schaltflächen und einige Auswahl funktioniert. Die Geige hier: http://jsfiddle.net/pVBU8/1/

---

alle Eingänge erhalten:

var allInputs = $(":input"); 

die alle Eingänge Typ erhalten:

allInputs.attr('type'); 

die Werte erhalten:

allInputs.val(); 

HINWEIS: .val() ist NICHT das Gleiche as: geprüft auf diejenigen Typen, bei denen dies relevant ist. Verwendung:

.attr("checked"); 

---

EDIT 1. Februar 2013 - re: jQuery 1.9 Verwendung prop() nicht attr() als attr nicht die richtigen Werte für Eigenschaften zurück, die sich geändert haben.

.prop('checked'); 

oder einfach

$(this).checked; 

---

den Wert der Kontrolle zu bekommen - was auch immer es zur Zeit ist. oder verwenden Sie einfach ': checked', wenn Sie nur diejenigen möchten, die überprüft werden.

EDIT: Hier ist eine andere Art und Weise Art zu erhalten:

var allCheckboxes=$('[type=checkbox]'); 

EDIT2: Beachten Sie, dass die Form:

$('input:radio'); 

über

perferred ist

$(':radio'); 

die beide gleichsetzen zu:

$('input[type=radio]'); 

aber die „Eingabe“ erwünscht ist, so dass es nur die Eingaben erhält und verwendet nicht die universelle ‚*“, wenn die Form von $(':radio') verwendet wird, das entspricht $('*:radio');

EDIT 19. August 2015: Präferenz für die $('input[type=radio]'); sollte verwendet werden, damit moderne Browser die Suche nach einem Funkeingang optimieren können.

---

EDIT 1. Februar 2013 pro Kommentar re: wählt Elemente @dariomac

$('select').prop("type"); 

zurückkehren wird entweder "select-one" oder "select-multiple" in Abhängigkeit von dem "multiple" Attribute und

$('select')[0].type 

gibt das gleiche für die erste Auswahl zurück, wenn sie existiert. und

($('select')[0]?$('select')[0].type:"howdy") 

wird den Typ zurückgeben, wenn es existiert oder "howdy", wenn es nicht ist.

$('select').prop('type'); 

gibt die Eigenschaft der ersten im DOM zurück, wenn sie existiert, oder "undefiniert", wenn keine existiert.

$('select').type 

gibt den Typ des ersten zurück, wenn es existiert, oder einen Fehler, wenn keiner existiert.

Answer 2

Sie können folgendes tun:

var inputType = $('#inputid').attr('type'); 

Answer 3

$("#yourobj").attr('type'); 

Answer 4

GetValue = function(id) { 
    var tag = this.tagName; 
    var type = this.attr("type"); 

    if (tag == "input" && (type == "checkbox" || type == "radio")) 
    return this.is(":checked"); 

    return this.val(); 
}; 

Answer 5

Der beste Ort zu Beginn der Suche ist http://api.jquery.com/category/selectors/

Dies wird Ihnen einen guten Satz von Beispielen geben.

Die Auswahl der Elemente im DOM wird hauptsächlich mit CSS-Selektoren erreicht. Wenn Sie also ein Element nach ID suchen, sollten Sie $ ('# elementId') verwenden, wenn Sie alle Eingabemarken $ verwenden möchten. 'input') und schließlich der Teil, den ich denke, Sie wollen, wenn Sie alle Eingabe-Tags mit einer Art von Kontrollkästchen verwenden möchten $ ('input, [type = checkbox])

Hinweis: Sie finden die meisten der Werte, die Sie sind auf Attribute wollen, dass der CSS-Selektor für Attribute so ist: [attribute = value]

Nur weil man für die Drop-Down-gestellt, einen Listbox aposed folgend versuchen:

$('select, [size]).each(function(){ 
    var selectedItem = $('select, [select]', this).first(); 
}); 

Der Code aus dem Speicher war so für kleine Fehler bitte

Answer 6

var val = $('input:checkbox:checked, input:radio:checked, \ 
    select option:selected, textarea, input:text', 
    $('#container')).val(); 

Kommentare:

1. Ich gehe davon aus, dass es genau ein Formelement ist, dass entweder ein Textfeld sein kann, Eingabefeld, wählen Sie Form, eine Reihe von Radio-Buttons oder ein einzelne Kontrollkästchen (Sie müssen meinen Code aktualisieren, wenn Sie weitere Kontrollkästchen benötigen).

2. Das fragliche Element lebt in einem Element mit der ID container (um Ambiguenzen mit anderen Elementen auf der Seite zu entfernen).

3. Der Code gibt dann den Wert des ersten passenden Elements zurück. Da ich :checked usw. verwende, sollte dies immer genau der Wert dessen sein, wonach Sie suchen.

Answer 7

Wenn das, was Sie sagen, ist, dass Sie alle Eingaben in einem Formular zu bekommen, die einen Wert ohne sich Gedanken über die Eingabetyp haben, versuchen Sie dies:

Beispiel:http://jsfiddle.net/nfLfa/

var $inputs = $('form').find(':checked,:selected,:text,textarea').filter(function() { 
    return $.trim(this.value) != ''; 
}); 

Jetzt sollten Sie eine Reihe von Eingabeelementen haben, die einen gewissen Wert haben.

Sie können die Werte in einem Array setzen:

var array = $inputs.map(function(){ 
    return this.value; 
}).get(); 

Oder Sie könnten sie serialisiert werden:

var serialized = $inputs.serialize(); 

Answer 8

Es scheint, dass die attr Funktionalität weiter

veraltet immer

$(this).attr('TYPE') 
undefined 
$(this).prop('type') 
"text" 

Answer 9

In meiner Anwendung endete ich mit zwei verschiedenen Elementen mit der gleichen ID (schlecht). Ein Element war ein Div und das andere ein Input. Ich habe versucht, meine Eingaben zusammenzufassen und brauchte eine Weile, um die doppelten IDs zu realisieren. Durch die Art des Elements platzieren ich vor # wollte, ich war in der Lage, den Wert des Eingangselementes zu packen und die div verwerfen:

$("input#_myelementid").val(); 

Ich hoffe, es hilft.