JQuery con diversi elementi

ho un ancoraggio nel DOM e il seguente codice lo sostituisce con un pulsante di fantasia. Funziona bene ma se voglio più pulsanti si blocca. Posso farlo senza un ciclo?

$(document).ready(buttonize); function buttonize(){ //alert(buttonAmount); //Lookup for the classs var button = $('a.makeabutton'); var buttonContent = button.text(); var buttonStyle = button.attr('class'); var link = button.attr('href'); var linkTarget = button.attr('target'); var toSearchFor = 'makeabutton'; var toReplaceWith = 'buttonize'; var searchButtonStyle = buttonStyle.search(toSearchFor); if (searchButtonStyle != -1) { //When class 'makeabutton' is found in string, build the new classname newButtonStyle = buttonStyle.replace(toSearchFor, toReplaceWith); button.replaceWith('' +buttonContent+''); $('.buttonize').click(function(e){ if (linkTarget == '_blank') { window.open(link); } else window.location = link; }); } } 

Usa ciascun metodo perché stai recuperando una raccolta di elementi (anche se è solo uno)

 var button = $('a.makeabutton'); button.each(function () { var btn = $(this); var buttonContent = btn.text(); var buttonStyle = btn.attr('class'); var link = btn.attr('href'); var linkTarget = btn.attr('target'); var toSearchFor = 'makeabutton'; var toReplaceWith = 'buttonize'; var searchButtonStyle = buttonStyle.search(toSearchFor); ... }; 

ogni metodo scorre attraverso tutti gli elementi che sono stati recuperati ed è ansible utilizzare la parola chiave this per fare riferimento all’elemento corrente nel loop

 var button = $('a.makeabutton'); 

Questo codice restituisce un object jQuery che contiene tutti gli ancoraggi corrispondenti. È necessario .each ciclo utilizzando .each :

 $(document).ready(buttonize); function buttonize() { //alert(buttonAmount); //Lookup for the classs var $buttons = $('a.makeabutton'); $buttons.each(function() { var button = $(this); var buttonContent = button.text(); var buttonStyle = button.attr('class'); var link = button.attr('href'); var linkTarget = button.attr('target'); var toSearchFor = 'makeabutton'; var toReplaceWith = 'buttonize'; var searchButtonStyle = buttonStyle.search(toSearchFor); if (searchButtonStyle != -1) { newButtonStyle = buttonStyle.replace(toSearchFor, toReplaceWith); button.replaceWith('' + buttonContent + ''); $('.buttonize').click(function(e) { if (linkTarget == '_blank') { window.open(link); } else window.location = link; }); // end click } // end if }); // end each }