Eenmalige gebeurtenis in jQuery

Toe ons die loskoppeling van gebeurtenisse met behulp van die metode off bestudeer het, het ons die volgende konstruksie gebruik:

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

Eers het ons die verwerkingsfunksie aangeheg met behulp van on, daarna losgemaak met behulp van off.

In jQuery is daar 'n gerieflike metode one, wat toelaat om 'n eenmalige gebeurtenis te bind - dit sal slegs een keer uitgevoer word, en dan outomaties losgemaak word. Hierdie metode neem die gebeurtenistipe as eerste parameter, en die gebonde funksie as tweede.

Die volgende voorbeeld sal ons beskou gebaseer op die onderstaande HTML-kode:

<ul>
	<li>teks</li>
	<li>teks</li>
	<li>teks</li>
</ul>

Die CSS-kode lyk so:

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

Nou bind ons 'n eenmalige gebeurtenis aan elke li:

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

Druk op die punte van die lys. Soos jy kan sien, het ons dieselfde effek verkry, danksy die metode one.

Bind 'n gebeurtenis aan alle skakels - wanneer daar oor 'n skakel beweeg word, word sy href in ronde hakkies aan die einde van sy teks bygevoeg. Na die eerste keer wat oor die skakel beweeg word, moet die gebeurtenis wat die href by die einde van die teks voeg, daarvan losgemaak word.

Maak vir alle invoervelde so dat hulle hul eie value uitskryf wanneer op enige een daarvan gedruk word, maar slegs met die eerste druk. 'n Herhaalde druk op die invoerveld moet geen reaksie veroorsaak nie.

Daar is paragrawe met getalle. Met 'n klik op 'n paragraaf moet die kwadraat van die getal wat dit bevat daarin verskyn, maar slegs met die eerste klik. Met 'n dubbelklik op die paragraaf moet die getal in die paragraaf verdubbel word, maar ook slegs die eerste keer.

Daar is paragrawe. Maak so dat met die eerste klik op 'n paragraaf 'n '!' aan die einde daarvan bygevoeg word, maar slegs met die eerste klik.