Еднократно събитие в 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 при
натискане на който и да е от тях, но само при
първото натискане. Повторно натискане на
инпут не трябва да предизвиква реакция.
Дадени са абзаци с числа. При кликване на абзац в него трябва да се появи квадратът на числото, което той съдържа, но само при първото кликване. При двойно кликване на абзац числото в абзаца трябва да се удвои, но също само първия път.
Дадени са абзаци. Направете така, че при първото
кликване на абзац в неговия край да се добави '!',
но само при първото кликване.