Keresés

Új hozzászólás Aktív témák

  • Jim-Y

    veterán

    válasz Sk8erPeter #4087 üzenetére

    Story mode on :D

    Adott a feladat, vannak egy generált oldalon gombok, a fajta gombból is >= 0 darab, b fajta gombból is >=0 de általában több darab. Ezen kívül még van pár elem amire listenert kell kötni mert azok is csinálnak valamit. Maga az action nagyon egyszerű, a és b gombok esetén is csak el kell navigálni egy adott url-re, de az url-ben változnak a query paraméterek. Ugye ebben semmi nehéz sincs, meg is csináltam gyorsan, kb ilyeneket írtam:

    var aButtons = document.getElementsByClassName('a'),
    bButtons = document.getElementsByClassName('b'),
    cButton = document.getElementById('c'),
    dDropdown = document.getElementById('d');

    for(var i = 0; i < aButtons.length; ++i){
    aButtons[i].addEventListener('click', function(){
    var queryParam = this.getAttribute("data-myImportantValue");
    window.document.location.href = 'localhost:myport/myservice/..stb/myFun&query=' + queryParam;
    return false;
    });
    }

    .. bButtons-re is..
    ...cButton-re is stb..

    Mivel gyorsan megvolt, gondoltam akkor megpróbálom szebben megírni, arra gondoltam, hogy például az szebb lenne, meg memória (bár itt annyira mindegy...) szempontjából is jobb lenne, ha a function() { ... } helyett lenne egy eventHandler függvényem amit az összesben tudnék használni. És az lenne még jó, gondoltam, ha a 'localhost:myport/myservice/..stb/myFun' részt, mivel myFun minden esetben más aButton-ök esetén myFunc, bButton-ok esetén myFunc2 stb... ha ezt megadhatnám a handler paraméterében, valamint arra gondoltam, hogy a queryParamétereket &query= is egy paraméterben adnám át a handler függvénynek.

    Azt nem tudtam, hogy ezt így nem lehet, sőt, igazából lehet.

    Megnéztem az addActionListener Chrome beli implementációját, máshol is tuti így van, ott van egy listeners tömb, amibe a listener függvény objektumokat teszik. Ezáltal később lehet mondani removeListenert amikor csak simán kiveszik a listener függvényobj-ot a tömbből. Ezért ha ezt írom, az nem jó.

    addEventListener('click', eventHandler(param1, param2));

    Mert ebben az esetben a () miatt rögtön meg is hívom a függvényt ami ugye nem jó, a tömbbe se tudja a böngésző így betenni stb...

    Mentem tovább, mi lenne, ha a paramétereket bindolnám az objekthez, így nem kéne a függvényt rögtön meghívni, a böngésző el tudná tárolni a listeners tömbben:

    addEventListener('click', eventHandler.bind(thisArg, param1, param2));

    Ez jobb, itt a két paraméter a függvényhez lett bindolva, ezeket elérem egy ilyen fügvénnyel utána:

    function eventHandler(param1, param2) { }

    De ezzel meg az a gond, hogy a thisArg-nak nem tudtam átadni se az event-et, se a this-t. Tehát az eventListener-ben utána nem érem el a aButtons objektet, szóval ez se jó így.

    Na és valahol itt írtam be a topikba, hogy hátha valahogy meg lehet úgy csinálni, hogy az eventHandler függvénynek átadom a aButtons(i) referenciát mint thisArg, valamint a saját paramétereimet, és akkor írhattam volna ilyeneket:

    for(var i = 0; i < aButtons.length; ++i){
    aButtons[i].addEventListener('click', eventHandler(this, 'localhost:myport/myservice/..stb/myFun', {
    someId: "data-myImportantValue",
    somOtherId: "data-otherImportantId"
    }));
    }

    for(var i = 0; i < bButtons.length; ++i){
    bButtons[i].addEventListener('click', eventHandler(this, 'localhost:myport/myservice/..stb/myFun2', {
    someStuff: "akarmi"
    }));
    }

    function eventHandler(baseUrl, queryParams) {
    var queryString = processParams(queryParams);
    // queryString:
    // &someId=<this.getAttribute("data-myImportantValue")>&someOtherId=<this.getAttribute("data-otherImportantId")>
    window.document.location.href = baseUrl + queryString;
    }

    Szóval semmi komoly, csak szebben/jobban/máshogy akartam megcsinálni, ennyi :)

    Megj: PH random italic tageket tesz a hsz-be, wtf? Nem győzöm törölni őket :D

    Hát de ez mi? Nem tudom kitörölni a hsz-ből a dőlt bekezdéseket, mert visszteszi őket :/ Itt van amit nem sikerül szépen formáznom: pastebin

    Karma: de, pont ezt, de a sokBtns eszembe se jutott ^^ :R

Új hozzászólás Aktív témák

Hirdetés