Wie man element-Daten in click-Funktion?
Ist es ein aufgeräumter/einfacher Weg, um die checkbox-element 's ' catNum' Wert, wenn Sie in die click () - Funktion?
function createCategoriesList() {
var catNames = new Array("First cat", "Second cat", "Third cat");
var catImageURLs = new Array("First.png", "Second.png", "Third.png");
jQuery('<ul/>', {
id: 'map-cats'
}).appendTo('#map-controls');
for(var i = 0; i < catNames.length; i++ ) {
var listItem = jQuery('<li/>').appendTo('#map-cats');
jQuery('<img/>', {
src: catImageURLs[i],
alt: ''
}).appendTo(listItem);
var checkbox = jQuery('<input/>', {
type: 'checkbox',
checked: 'checked',
id: 'cat_' + i,
name: 'cat_' + i
}).appendTo(listItem);
checkbox.data("catNum", i);
checkbox.click(function() {
//alert("The cat num selected is: " + this.data("catNum")); //throws exception
alert("The cat num selected is: " + jQuery('#' + this.id).data('catNum')); //works but there must be a better way??
});
jQuery('<label/>', {
htmlFor: catImageURLs[i],
text: catNames[i],
for: 'cat_' + i
}).appendTo(listItem);
}
}
Du musst angemeldet sein, um einen Kommentar abzugeben.
Element, kommt in der
click
Funktion ist ein raw-DOM-Objekt, nicht ein jQuery-Objekt, um die Verwendung der jQuery-Methoden auf, die wir weitergeben müssen es durch jQuery-ersten. Dies ist der Grund, warumthis.data("catNum")
nicht funktioniert in deinem Beispiel-code.Aber die
jQuery()
Funktion annehmen kann-DOM-Objekte sowie-Selektor-strings, so dass anstelle vonkönnen Sie einfach
Die, wie Sie wollte, viel aufgeräumter.
Alternativ können Sie
this
als raw-DOM-Objekt, aber Sie müssten verwenden Sie die DOM-Methoden, anstatt die jQuery-Methoden:oder
Meine zwei Cent. Sorry für umfassendere Antwort, als Sie gefragt /I geplant. Möglicherweise Tippfehler, aber scheint zu funktionieren bei js-fiddle: