Դելեգացում jQuery-ում
Եթե դուք ուսումնասիրել եք JavaScript, ապա արդեն հանդիպել եք իվենթների դելեգացման թեմային, որի միջոցով հնարավոր է, օրինակ, ազատվել նոր տարրերի համար իվենթներ կցելու խնդիրներից: Եկեք տեսնենք, թե ինչպես դա կգործի jQuery-ում:
Վերցնենք հետևյալ HTML կոդը:
<ul>
<li>տեքստ</li>
<li>տեքստ</li>
<li>տեքստ</li>
</ul>
CSS-ը դրա համար այսպիսի տեսք ունի.
li {
width: 100px;
cursor: pointer;
}
Եկեք այժմ, օգտագործելով
on
մեթոդը, կկցենք click մեթոդը ոչ թե
ցանկի li կետին, ինչպես անում էինք նախորդ
դասերում, այլ հենց ցանկի ul վրա: Նաև կփոխանցենք
երկրորդ (ոչ պարտադիր) պարամետրով 'li' որպես
ժառանգների ընտրիչ: Տեսնենք, թե ինչ ստացվեց.
$('ul').on('click', 'li', function() {
$(this).append('!');
});
Տրված է ul, նրա մեջ կան մի քանի li:
ul-ի տակ արեք կոճակ, որի սեղմումով
ul-ի վերջում կավելացվի նոր li
'կետ' տեքստով: Արեք այնպես, որ
յուրաքանչյուր li-ի վրա կլիկ անելիս դրա վերջում ավելանա
'!': Սա պետք է աշխատի նաև նոր
ավելացված li-ների համար: Խնդիրը լուծեք օգտագործելով
դելեգացում (այսինքն՝ իվենթը պետք է
կցված լինի ul-ին):
Տրված է օգտատերերի աղյուսակ երկու սյունակով՝ անուն եւ
ազգանուն: Աղյուսակի տակ արեք ձև, որի օգնությամբ
հնարավոր կլինի ավելացնել նոր օգտատեր
աղյուսակում: Արեք այնպես, որ ցանկացած
բջիջի վրա կլիկ անելիս հայտնվի prompt, որի օգնությամբ
հնարավոր կլինի փոխել բջիջի տեքստը: Խնդիրը լուծեք
օգտագործելով դելեգացում (այսինքն՝ իվենթը
պետք է կցված լինի table-ին):