Autor Zpráva
Sventek
Profil
Dobrý večer,
chtěl bych se zeptat, zda-li už někdo úspěšně nebojoval s následujícím problémem:

Mějme například nečíslovaný seznam
<ul>
<li>První</li>
<li>Druhý</li>
</ul>

A pod něj umístím tlačítko na přidání položky do tohoto seznamu, bude jej obsluhovat následující jQuery funkce:
$("button").click(function () { 
   $("ul").apend("<li>Další</li>");
});


Vše až doposud funguje bez potíží. Jestliže ale potřebuju vykonat akci po kliknutí na položky seznamu (dejme tomu např. alert). Tak ta se provádí jen na položkách, které jsou ve stránce od začátku a ne na nově vzniklých. Zde je pro úplnost funkce, která vyhazuje prázdnou hlášku:
  $("li").click(function () { 
	 alert(); 
    });


Moje znalosti JS jsou spíše povrchní, s jQuery teprve začínám, ale přijde mi, že potíž bude v tom, že DOM se načte jen na začátku a o nově přidaných položkách JS "neví". Řešení jsem zkoušel hledat, ale nic funkčního jsem nenašel. Nevíte někdo prosím, zda to lze nějak vyřešit, aniž bych musel do nově vytvořených položek vkládat event onclick='alert()'?

Díky
fajzen
Profil
DOM se načte jen na začátku a o nově přidaných položkách JS "neví"
toto nie je celkom presné, DOM o nových položkách "vie", ale

$("li").click(function () { 
     alert(); 
    });

sa vykoná po načítaní stránky, čiže funkcia sa aplikuje len na prvky, ktoré v tej chvíli existujú

riešením je aplikovať funkciu na novo vytvorené prvky explicitne, napr:

function akcia()
{
    alert('ahoj, svet!');
}

$("li").click(function () { 
     akcia();
});

$("button").click(function () { 
   $("ul").append("<li>Další</li>").click(function() {
        akcia();
    });
});
ah01
Profil
Sventek
Je to tak jak píše fajzen. Druhou možností je použít live.

fajzen
V druhé ukázce kódu máš jednu chybu a zbytečně vytváříš anonymní funkce.
function akcia()
{
    alert('ahoj, svet!');
}

$("li").click(akcia);

$("button").click(function () { 
   $("<li>Další</li>")
      .appendTo("ul")
      .click(akcia);
});
fajzen
Profil
ah01
o možnosti s live som nevedel (s jQuery tiež len začínam), šikovné :)
ďakujem za opravenie chyby, slepo som to opisoval od Sventeka

s tou anonymnou funkciou máš pravdu, je to taký zvyk (teraz som si uvedomil, že dosť zlý)
na druhú stranu, keby funkcia akcia prijímala nejaké parametre, použil by sa zápis s anonymnou funkciou (to len tak naokraj)
sventek
Profil *
Hoši, oběma mockrát děkuju.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: