Једнократни догађај у jQuery

Када смо учили одвајање догађаја помоћу методе off, користили смо следећу конструкцију:

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

Прво смо прикачили функцију-обрађивач помоћу on, затим је одјавили помоћу off.

У jQuery-у постоји погодан метод one, који омогућава да се веже догађај који се покреће само једном - извршиће се само једном, а затим се аутоматски одвеже. Овај метод као први параметар прима тип догађаја, а као други - функцију коју треба повезати.

Следећи пример ћемо размотрити на основу HTML кода испод:

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

CSS код изгледа овако:

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

Сада за сваку li вежемо догађај који се покреће само једном:

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

Кликните на ставке листе. Као што видите, добили смо исти ефекат, захваљујући методу one.

За све линкове повежите догађај - при преласку курсора преко линка на крај његовог текста додаје се његов href у заградама. После првог преласка преко линка треба да се одвеже догађај који додаје href на крај текста.

За све уносна поља (инпуте) подесите да приказују своју value вредност при клику на било које од њих, али само при првом клику. Поновни клик на унос поље не би требало да изазове реакцију.

Дати су параграфи са бројевима. При клику на параграф у њему треба да се појави квадрат броја који садржи, али само при првом клику. При дуплом клику на параграф број у параграфу треба да се удвостручи, али такође само први пут.

Дати су параграфи. Подесите да при првом клику на параграф на његов крај дода '!', али само при првом клику.