Jquery - Selezionare gli elementi creati da jquery stesso

**RiodaV** · 14-11-2010, 04:53

Salve ragazzi,

sto armeggiando con jQuery cercando di migliorarlo, essendo davvero molto base.

Ho notato che se creo nuovi elementi con, ad esempio, "append" poi non posso lavorarci.
Insomma questi elementi restano creati e non si possono più usare, pare.

Nella documentazione ufficiale di jquery ho trovato solo questo:

Why doesn't an event work on a new element I've created?

As explained in the previous question about AJAX, events are bound only to elements that exist at the time when you issue your initial jQuery call. When you create a new element, you must bind the event to it separately, or use event delegation.

Ho visto un po' i link consigliati ma vanno troppo oltre le mie necessità. A dire il vero a me servirebbe solamente selezionare sti elementi creati, per iniziare.

Qualche consiglio?

**antotan** · 15-11-2010, 09:26

I bind creati prima dell'append ovviamente non possono funzionare, come dice la documentazione.
Hai bisogno di bindare l'evento all'oggetto quando lo crei oppure anche successivamente, se hai la possibilità di reperirlo. L'importante è farlo dopo averlo creato:

codice:

<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    <script>
      $(document).ready(function(){
      	$("#mydiv").click(function(){
          var newdiv = $("<div>");
          newdiv.html("NEW DIV");
          newdiv.click(function(){ alert("Bind dinamico"); });
          $("body").append(newdiv);
        });
      });
    </script>
  </head>
    
  <body>
    <div style="border: 1px solid black" id="mydiv">Click</div>
  </body>
</html>

In questo esempio creo un nuovo div e creo il bind. Se clicki sul nuovo div dovrebbe venirti fuori l'alert.

**m4rko80** · 15-11-2010, 10:09

Ciao, in alcuni casi il bind non li prende comunque, non ho capito esattamente quando ma ho piu' vollte risolto con live() cosi':

codice:

    <script>
      $(document).ready(function(){
      	$("#idCreato").live('click', function(){
            //.....
        });
      });
    </script>

**antotan** · 15-11-2010, 10:30

Ciao, m4rko80. Riesci a fornire un esempio di bind non preso?
Solitamente questo capita non mettendo il codice nel metodo 'ready'.
Se il codice lo metti nel ready e non va lo stesso sarebbe interessante capire il perchè.

**m4rko80** · 15-11-2010, 10:43

Ciao, non mi ricordo esattamente in che situazione, se non error stavo lavorando con sortable, draggable... e dopo la clonazione di un elemento non riuscivo appunto a lavorare appunto coi nuovi elementi ed avevo ovviato con live().
Non escludo di avar magari errato qualcosa ma per mia esperienza avevo risolto in questo modo.
Se tu hai la certezza e/o la soluzione senza dover utilizzare il live tanto meglio.. faro' delle prove appena possibile grazie

**RiodaV** · 15-11-2010, 16:24

Ok, ragazzi, grazie ai vostri consigli e ad un po' di vodoo sono riuscito a cavarmi d'impaccio.

Il .live() è utile ma solo per velocizzare in determinati casi, ma immagino che l'altro codice dia più libertà.

A me serviva accedere agli elementi perché avevo una lista creata dall'utente in maniera dinamica, e praticamente dovevo dare un colore agli elementi pari ed un altro agli elementi dispari.

Lavorando sulla base dell'esempio postato da antotan sono giunto a questa soluzione:

codice:

<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    <script>
      $(document).ready(function(){	
      	$("#clickme").click(function(){
          newli = $("[*]");
          newli.html("NEW LI");	
	  $("body ul#newlist").append(newli);
	  newli.each(function() { 
	    $('#newlist li:odd').css('background', 'blue'); 
	    $('#newlist li:even').css('background', 'red');
	  });
        });
      });
    </script>
  </head>
    
  <body>
    <div id="clickme">Clickme</div>
    <ul id="newlist">[/list]
  </body>
</html>

Soluzione che applicherò al mio script.
Secondo voi è la soluzione migliore? Lo scrivereste in modo diverso?

Fatemi sapere e grazie per le risposte.

**antotan** · 15-11-2010, 18:05

Beh, direi che va bene.
In generale terrei traccia dell'ultimo elemento inserito e del colore di sfondo associatogli, così da dare al prossimo il colore di sfondo duale, senza dover ciclare ogni volta su tutta la lista.
Però suppongo che non verrano poi inseriti così tanti 'li', quindi la tua soluzione va più che bene.

Discussione: Jquery - Selezionare gli elementi creati da jquery stesso

Strumenti discussione

Ricerca discussione

Visualizza

Jquery - Selezionare gli elementi creati da jquery stesso

Permessi di invio