Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: jQuery, dodanie akcji do elementu który przed chwilą utworzyłem
Forum PHP.pl > Forum > XML, AJAX
pgrzelka
26.01.2010, 13:04:45
Witam

w jQuery tworzę sobie kilka elementów

Kod
var id = <?php echo $i+1; ?>
    
    $('#dodaj').click(function(){
        $('<tr id="row'+id+'"><td><img rel="'+id+'" class="delete" src="/skin/icons/03/16/01.png" /></td></tr>').insertAfter('.items tr:last');
        id ++;
    });


dalej mam kod
Kod
$('.delete').click(function() {
        var rel = $(this).attr('rel');
        alert(rel);
  });


chciałbym aby każdemu IMG z class="delete" była przypisana funkcja która pobiera atrybut REL z tego IMG
powyższy kod działa dla IMG które były zapisane 'na sztywno', niestety nie reaguje dla elementów które utworzyłem później przyciskiem #dodaj,
jak rozwiązać mój problem ?
wookieb
26.01.2010, 13:12:36
użyj live, albo tworz elementy poprzez ich klonowanie
[JAVASCRIPT] pobierz, plaintext 
  1. var clone = $('element').clone(true); // tworzt kopie elementu wraz z jego zdarzeniami
  2. $('innyelement').append(clone); // czy tam twoj insertAfter
[JAVASCRIPT] pobierz, plaintext
kosmowariat
26.01.2010, 13:13:34
ten drugi kawałek musisz wykonac dopiero po utworzeniu elementów albo przypisac onclicka w trakcie tworzenia elementu
pgrzelka
26.01.2010, 13:19:36
dzięki kosmowariat, przy dodawaniu elementu uruchamiam funkcję która przypisze akcje dla każdego class="delete",
wookieb: Twój sposób też byłby dobry ale bardziej by mi kod komplikował

Kod
var id = <?php echo $i+1; ?>
    
    $('#dodaj').click(function(){
        $('<tr id="row'+id+'"><td><input type="text" name="user['+id+']" /></td><td><input type="text" name="pass['+id+']" /></td><td><select name="admin['+id+']"><option value="0">Nie</option><option value="1">Tak</option></select></td><td><img rel="'+id+'" class="delete" src="/skin/icons/03/16/01.png" /></td></tr>').insertAfter('.items tr:last');
        id ++;
        przypisz_delete();
    });
    
    function przypisz_delete() {
        $('.delete').click(function() {
            var rel = $(this).attr('rel');
            alert(rel);
            $('#row'+rel+' input').remove();
            $('#row'+rel+' select').remove();
            $('#row'+rel).hide("slow");
        });
    }
    przypisz_delete();
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.