• Ozingizning vidjetingizni yozish
  • Mansur Muzaffarovning " Web dasturlashga kirish "




    Download 113.82 Kb.
    bet3/3
    Sana14.05.2023
    Hajmi113.82 Kb.
    #59475
    1   2   3
    Bog'liq
    KI Mansur Muzaffarov Mustaqil ish 1
    4-amaliy mashgulot, 2022 Biologiya 500 test. GREAT TEACHERS, Jewellary Management System, 2-laboratoriya ishi kompyuter tarmoqlari Sanjarbek Suyunov AX-12-20, BOLTAYEVA N, 4-Amaliy, Temirova Nargiza ki 11 19c gruppa dasturlash 2 mustaqil ishi(2), мутаклл (1), 2-3 амалий машғулот, 1 Tursunova G ., 3 amaliy mashg\'ulot Biznes jarayonlarni boshqarish Mamanazarov Asrorbek, 1 - mustaqil ish Tarmoq xavfsizligi, Takror va aralash algoritm, i4wEmWW9IN7cLf0rP0pZ
    Mavzular
    JQuery UI-ning eng ajoyib xususiyatlaridan biri bu barcha vidjetlarning terisini bir vaqtning o'zida o'zgartirish qobiliyatidir va buning uchun maxsus yordam dasturi ham mavjud - ThemeRoller :

    Agar ma'lum bir vaqt ichida siz mavzuga o'zgartirish kiritishingiz kerak bo'lsa, "jquery-ui - #. #. ## - custom.css" faylini oching va "Ushbu mavzuni ko'rish va o'zgartirish uchun matndan boshlanadigan qatorni toping, http: .. ga tashrif buyuring. ". Ushbu havolaga o'ting va kerakli o'zgarishlarni amalga oshirish uchun ThemeRoller-dan foydalaning.
    O'zingizning vidjetingizni yozish
    Rasmiy hujjatlar jQuery UI uchun vidjet yozishda siz uchun boshlang'ich nuqta bo'ladi , ammo hamma ham ingliz tilini bilmaganligi sababli, undagi ma'lumotlarni tarjima qilishga va moslashtirishga harakat qilaman.
    Eslatib o'tadigan birinchi narsa shundaki, jQuery uchun plaginlarni yozish qoidalari juda ta'sirli, bu ularning sifatiga hissa qo'shmaydi. JQuery interfeysini yaratishda biz plaginlar va vidjetlarni yozish jarayonini standartlashtirish yo'lidan borishga qaror qildik. Ushbu g'oya qanchalik muvaffaqiyatli bo'lganligini ayta olmayman, ammo u aniqroq bo'lganidan yaxshiroq bo'ldi. Vidjetingiz uchun ramkani tavsiflash bilan boshlayman:
    $.widget("book.expose", {
    // настройки по умолчанию
    options: {
    color: "red"
    },
    // инициализация widget
    // вносим изменения в DOM и вешаем обработчики
    _create: function() {
    this.element; // искомый объект в jQuery-обёртке
    this.name; // имя - expose
    this.namespace; // пространство – book
    this.element.on("click."+this.eventNamespace, function(){
    console.log("click");
    });
    },
    // метод отвечает за применение настроек
    _setOption: function( key, value ) {
    // применяем изменения настроек
    this._super("_setOption", key, value );
    },
    // метод _destroy должен быть антиподом к _create
    // он должен убрать все изменения, внесенные в DOM, и убрать все обработчики, если таковые были
    _destroy: function() {
    this.element.off('.'+this.eventNamespace);
    }
    });
    Izohlarni o'qimaganlar uchun tushuntirib beray:
    options - ma'lum bir element uchun vidjet sozlamalarini saqlash
    _create() - vidjetni ishga tushirish uchun javobgardir - bu erda DOMda o'zgarishlar bo'lishi kerak va voqea ishlovchilarini "osib qo'yish" kerak
    _destroy() - "_create ()" uchun antipod - biz tashlagan barcha narsalarni tozalash kerak
    _setOption(key, value) - har qanday sozlamalarni o'zgartirmoqchi bo'lganingizda ushbu usul chaqiriladi:
    $("#my").expose({key:value})
    E'tiborli ko'z, sanab o'tilgan usullarning barchasi pastki chiziq bilan boshlanganini payqaydi - bu ishlatish uchun mavjud bo'lmagan "xususiy" usullarni ajratib ko'rsatish usuli. Agar biz $ ('# my') ishlatmoqchi bo'lsak, ('_ destroy') ni ko'rsatsak, xato bo'ladi. Ammo yodda tuting - bu faqat kelishuv, unga rioya qiling!
    Maxfiylik shartnomasini chetlab o'tish uchun siz "data ()" usulidan foydalanishingiz mumkin:
    $("#my").data("expose")._destroy() // место для смайла «(evil)»
    Ushbu misolda men vidjetlarni yozish uchun yaxshi ohang o'rnatishga harakat qildim - voqealar ishlovchilarini nomlar maydoniga "osib qo'ydim". Bu kelajakda vidjet kodiga chiqmasdan nima bo'layotganini boshqarish imkoniyatini beradi. "Haqiqiy hikoya".
    "_Destroy ()" usulida tasvirlangan kod ortiqcha, chunki u allaqachon ommaviy "destroy ()" da ijro etilgan. Aniqlik uchun bu erda ko'rsatilgan.
    Va har safar voqea ishlovchilarida "eventNamespace" ni ro'yxatdan o'tkazmaslik uchun dangasa odamlar uchun ishlab chiquvchilar 1.9.0 versiyasida ikkita usul qo'shdilar: "_on ()" va "_off ()". Birinchisi ikkita parametrni oladi:

    • DOM elementi yoki selektor yoki jQuery ob'ekti

    • ob'ekt sifatida voqea ishlovchilarining to'plami

    Ro'yxatdagi barcha tadbirlar "eventNamespace" da "osiladi", ya'ni. natija taxminan bir xil bo'ladi:
    this._on(this.element, {
    mouseover:function(event) {
    console.log("Hello mouse");
    },
    mouseout:function(event) {
    console.log("Bye mouse");
    }
    });
    Ikkinchi usul "_off ()" sizga ishlov beruvchilarni tanlab o'chirishga imkon beradi:
    this._off(this.element, "mouseout click");
    Xullas, ramka - bu ishga tushirish, funksionallikka o'tish vaqti keldi. Ixtiyoriy funktsionallik bilan ixtiyoriy funktsiyani qo'shaylik:
    callMe:function() {
    console.log("Allo?");
    }
    Ushbu funktsiyaga vidjetning boshqa usullaridan ham, tashqaridan ham osonlik bilan kirishimiz mumkin:
    // изнутри
    this.callMe()
    // извне
    $("#my").expose("callMe")
    Agar sizning funktsiyangiz parametrlarni qabul qilsa, ular quyidagi tarzda uzatiladi:
    $("#my").expose("callMe", "Hello!")
    Agar siz voqea ishlovchilarida vidjet uslubiga o'tishni xohlasangiz, o'zgaruvchilar ko'lami haqida unutmang va quyidagi manevrani bajaring:
    {
    _create: function() {
    var self = this; // вот он!
    this.element.on("click."+this.eventNamespace, function() {
    // тут используем self, т.к. this уже указывает на
    // элемент по которому кликаем
    self.callMe();
    })
    }
    }
    Kelinglar yaxshi, endi voqealar haqida gaplashaylik. Vidjetlarni yanada moslashuvchan ishlab chiqish va amalga oshirish uchun o'zboshimchalik bilan hodisalar yaratish va ularni "tinglash" funksiyalari taqdim etiladi:
    // инициируем событие
    this._trigger("incomingCall");


    // подписываемся на событие при инициализации виджета
    $("#my").expose({
    incommingCall: function(ev) {
    console.log("din-don");
    }
    })


    // или после, используя в качестве имени события
    // имя виджета + имя события
    $("#my").on("exposeincomingCall", function() {
    console.log("tru-lya-lya")
    });
    Juda ko'p materiallar bor, men tushunaman, lekin vidjetning o'zi tomonidan chaqirilishi mumkin bo'lgan bir nechta usullarning tavsifini qo'shaman:
    _delay() - bu funktsiya "setTimeout ()" kabi ishlaydi, faqat uzatilgan funktsiya konteksti vidjetning o'ziga ishora qiladi (bu ko'lamni bezovta qilmaslik uchun)
    _hoverable()va _focusable()- bu usullar ularga "ui-state-hover" va "ui-state-focus" sinflarini avtomatik ravishda qo'shish uchun "hover" va "focus" hodisalarini kuzatib borish zarur bo'lgan elementlarni berish kerak. sodir bo'lishi
    _hide()va _show()- bu ikkita usul 1.9.0 versiyasiga kiritilgan, ular animatsiya usullarini qo'llashda vidjetlarning xatti-harakatlarini standartlashtirish uchun yaratilgan; sozlamalar odatda "yashirish" va "ko'rsatish" tugmachalari ostidagi variantlarda yashiringan. Usullardan quyidagicha foydalanish kerak:
    {
    options: {
    hide: {
    effect: "slideDown", // настройки эквиваленты вызову
    duration: 500 // .slideDown( 500)
    }
    }
    }
    // внутри виджета следует использовать вызовы _hide() и _show()
    this._hide( this.element, this.options.hide, function() {
    // это наша функция обратного вызова
    console.log('спрятали');
    });
    Bizgacha tatbiq etilgan yana ikkita usul mavjud:
    {
    enable: function() {
    return this._setOption( "disabled", false );
    },
    disable: function() {
    return this._setOption( "disabled", true );
    }
    }
    Aslida, ushbu funktsiyalar qo'ng'iroq uchun sinonim yaratadi:
    $("#my").expose({ "disabled": true }) // или false
    Download 113.82 Kb.
    1   2   3




    Download 113.82 Kb.

    Bosh sahifa
    Aloqalar

        Bosh sahifa



    Mansur Muzaffarovning " Web dasturlashga kirish "

    Download 113.82 Kb.