Labels sollten „for“-Attribute haben, die mit der ID des Eingabefeldes übereinstimmen, das sie beschriften. Das bedeutet, wir können dieses Attribut abgreifen und es in einem Selektor verwenden, um einen Klick auf das Eingabefeld selbst auszulösen. Vorausgesetzt natürlich, Sie haben einen Grund, Klicks auf Eingabefelder zu beobachten.
var labelID;
$('label').click(function() {
labelID = $(this).attr('for');
$('#'+labelID).trigger('click');
});
Ich bin mir nicht sicher, ob das das ist, was Sie meinen, aber Safari macht das bereits von Haus aus.
Alle Browser außer IE tun dies, wenn Sie es so codieren
<label><input id='my_input'/></label>
IE benötigt dies
<label for='my_input'><input id='my_input'/></label>
Wunderbar, Mann. Ihr Kommentar ist weitaus besser und hilfreicher als dieser Beitrag.
Fehler bei doppelter ID + Warnung, wenn im w3c-Validator geprüft. Jetzt ist es also an der Zeit, HTML5-Tags zu verwenden…
Diese Syntax ist auf jeden Fall nützlich. Aber die Entkopplung von
<label />ermöglicht es Ihnen, Dinge wieJa, ich sehe den Sinn dieses jQuery-Codes wirklich nicht. Unter Verwendung des „for“-Attributs des LABEL-Tags haben alle Browser diese Funktionalität bereits integriert. Eine Art nutzloser Beitrag, wirklich.
Hilfreich für mich, besonders mit Gravity Forms (oder allem, das Formularfelder dynamisch erstellt). Ein Fehler jedoch: $(‘#’+labelid).trigger(‘click’); sollte $(‘#’+labelID).trigger(‘click’); sein.
Danke
Brillantes Stück Code, genau das, was ich gesucht habe.
Dies behebt tatsächlich den IE-Bug, wenn Sie Bilder in Formular-Labels verwenden.
Normalerweise passiert bei einem Label, dass es, wenn Sie darauf klicken, den Fokus auf das Feld erhält, für das es bestimmt ist. Aus irgendeinem Grund scheint IE diese Funktionalität zu verlieren, wenn Sie Bilder in Formular-Labels verwenden.
Danke
Paula
Dieser Code ist tatsächlich ziemlich praktisch, wenn Sie FastClick auf iOS verwenden (um die 300-ms-Klickverzögerung zu vermeiden).
In dem seltenen Fall, dass Sie ein Label über einem Radiobutton oder einer Checkbox haben, verhindert FastClick, dass das Label die Eingabe auswählt.
Kein FastClick? Kein Problem, Sie sollten das hier nicht brauchen.
Danke!
Wenn Sie versteckte Radiobuttons haben und das Label zum Stylen verwenden (nicht ungewöhnlich), ist dies ein Lebensretter für mobile Geräte. Danke, Mann.
Ja, tatsächlich!
Fantastisch. Vielen Dank.
Warum ist das wichtig? Weil das Tag in iOS 5 Safari (iPad Gen 1s maximales OS) nicht klickbar ist. Dank dieses Codes funktioniert der Klick unter iOS 5 genauso wie in jedem anderen modernen Browser.
hahahaha
Hallo,
mit Safari IOS5.1.1 habe ich es mit
Ja... nur ein leeres onclick, lol
Bis bald ;)
(Blockcode-Fehler... Entschuldigung)
Hallo,
mit Safari IOS5.1.1 habe ich es mit
Ja... nur ein leeres onclick, lol
Bis bald ;)
Danke, Kumpel!
Ich brauche diesen Code für Gravity Form Bilder, um sie klickbar zu machen, aber er funktioniert nicht. Ich frage mich, ob ich auch Code in die benutzerdefinierte CSS-Klasse der Feld-IDs meines GF eingeben muss?
Das "onclick" würde die Option tatsächlich auswählen. Ich bin mir nicht sicher, ob dieser Code dafür funktionieren würde.
Alternative
$(function() {
$(‘label’).click(function() {
var id = $(this).attr(‘for’);
$(‘#’+id).select();
});
});
Schauen Sie hier: http://jsfiddle.net/sf3bgwxr/