Jednorázová událost v jQuery

Když jsme studovali odstraňování událostí pomocí metody off, použili jsme následující konstrukci:

$('li').on('click', function() {
	$(this).append('!');
	$(this).off('click', func);
});

Nejprve jsme připojili funkci-obsluhu pomocí on, poté jsme ji odstranili pomocí off.

V jQuery existuje pohodlná metoda one, která umožňuje navázat jednorázovou událost - provede se pouze jednou a poté se automaticky odpojí. Tato metoda přijímá jako první parametr typ události a jako druhý - připojenou funkci.

Následující příklad si prohlédneme na základě níže uvedeného HTML kódu:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

CSS kód vypadá takto:

li {
	width: 100px;
	cursor: pointer;
}

Nyní ke každému li připojíme jednorázovou událost:

$('li').one('click', function() {
	$(this).append('!');
});

Klikněte na položky seznamu. Jak vidíte, dosáhli jsme stejného efektu díky metodě one.

Připojte všem odkazům událost - při najetí myší na odkaz se na konec jejího textu připíše její href v kulatých závorkách. Po prvním najetí na odkaz je potřeba od něj odpojit událost, která přidává href na konec textu.

Pro všechny inputy zařiďte, aby vypisovaly svou value při kliknutí na kterýkoli z nich, ale pouze při prvním kliknutí. Opakované kliknutí na input nemá vyvolat reakci.

Jsou dány odstavce s čísly. Po kliknutí na odstavec se v něm má objevit druhá mocnina čísla, které obsahuje, ale pouze po prvním kliknutí. Po dvojitém kliknutí na odstavec se číslo v odstavci má zdvojnásobit, ale také pouze poprvé.

Jsou dány odstavce. Zařiďte, aby se po prvním kliknutí na odstavec na jeho konec přidalo '!', ale pouze po prvním kliknutí.