O‘zbekiston respublikasi axborot texnologiyalari va kommunikatsiyalarini rivojlantirish vazirligi muhammad al-xorazmiy nomidagi toshkent axborot texnologiyalari universiteti qarshi filiali

Download 23.78 Kb.
bet	5/8
Sana	05.01.2024
Hajmi	23.78 Kb.
	#130921

Bog'liq
3-amaliy ish Mavzu jquery selektorlar,hodisalar. Jquery ui-fayllar.org
Jaha, O’zbekiston respublikasi xalq ta’limi vazirligi, 696-698, 4-Mustaqil ish topshiriqlari (1), Mustaqil ish 1, 1-amaliyot, 5 MUSTAQIL, 1, Soliqlar va soliqqa tortish, Mavzu Bootstrap4 freymvorkni ulash, bazaviy shablonlarni sozlas-fayllar.org, Mavzu Bootstrap freymvork texnologiyasi. Bazaviy shablonlarni s-fayllar.org (1), 1-Maruza Kompyuter arxitekturasining rivojlanish bosqichlari, za-fayllar.org, snd malay, 1,Укитиш материаллари jild majmua11

let onReady = function () { jQuery('button').on('click', function() {}); } jQuery(onReady); Buning uchun kodimizni boshqacha yozishimiz kerak. Elementni tanlab, on() usulini chaqiramiz. Birinchi argument sifatida click so’zini yuboramiz. Ikkinchi argument sifatida esa anonim funksiya yuboramiz. onReady funksiyamizni alohida o’zgaruvchanda saqlab, keyin jQuery funksiyasiga yuborgan edik. Aslida boshqa o’zgaruvchanda saqlamasdan, birdaniga yuborish qulayroq. Lekin boshlovchi dasturchilarni bu chalg’itishi mumkin. Bir narsani eslab qoling: anonim funksiyalarni o’zgaruvchanda saqlamay, birdaniga biror usulga argument sifatida yuborishimiz mumkin. Ushbu kodimiz: button’da, click hodisasi ro’y berganda, manabu funksiyani chaqir demoqda. Click hodisasi deganda, sichqonchaning chap tugmasi bosilgan payt nazarda tutiladi. Hozir sichqonchamizni, ushbu tugmacha ustida bossak – hech narsa ro’y bermadi. Chunki yuborayotgan funksiyamizda hech nima yozilmagan. jQuery('button').on('click', function() { jQuery(this).css('background-color', 'red'); }); Funksiya ichida, sal oldinroq yozgan kodimizga o’xshash kod yozamiz. Bu yerda this obyekti – button elementi bilan bir. Brauzerda F5 tugmachasini bosamiz, ya’ni sahifamizni yangilaymiz. Hech narsa o’zgarmadi, chunki funksiyamiz faqat click hodisasi ro’y berganda chaqiriladi. Keling, tugma ustiga bosamiz, rostdan ham uning rangi o’zgardi. Click hodisasi aslida ikki boshqa hodisalardan iborat. Mousedown [maus davn], ya’ni sichqoncha tugmachasi pastga tushishi va Mouseup [maus ap], ya’ni sichqoncha tugmasi yuqoriga qaytishi. jQuery('button').on('mousedown', function() { jQuery(this).css('border-style', 'inset'); }); Funksiyamiz click hodisasida emas, mousedown’da ishlasin. Hususiyatimiz background-color emas border-style bo’lsin. Qiymatimiz esa: inset. Elemenimiz ustiga bosamiz. Ramka stili o’zgardi. Rostdan ham bosilish effekti paydo bo’ldi. Endi sichqoncha tugmachasi ortga qaytganda, ramkamiz stilini avvalgi holatiga qaytaraylik jQuery('button').on('mousedown', function() { jQuery(this).css('border-style', 'inset'); }); jQuery('button').on('mouseup', function() { jQuery(this).css('border-style', 'outset'); }); Mouseup hodisasi uchun funksiya yozamiz. Bu yerda sichqoncha tugmasi yuqoriga ko’tarilganda button elementimiz ramka stili – yana outset qiymatiga o’zgarishini ko’rsatdik. Ko’rib turganingizdek, endi button elementimizga bossak, chiroyli bosilish effekti paydo bo’ldi. Mouseup hodisasi ro’y berganda, ramka stilini o’zgartirishdan tashqari, ikki input’dagi raqamlarni bir-biriga qo’shaylik. < Download 23.78 Kb.

Download 23.78 Kb.