-
Fototrend
JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)
Új hozzászólás Aktív témák
-
Jim-Y
veterán
válasz
Sk8erPeter #4087 üzenetére
Story mode on
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
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 ^^
Új hozzászólás Aktív témák
- Dell Latitude 7410 Strapabíró Ütésálló Profi Ultrabook Laptop 14" -80% i7-10610U 16/512 FHD IPS MATT
- Eladó Lian Li O11D MINI-X gépház
- Lenovo ThinkPad P17 Tervező Vágó Laptop -50% 17,3" i7-10750H 32/512 QUADRO T1000 4GB
- FSP DAGGER PRO ATX3.0(PCIe5.0) 850W Sfx tápegység
- Eladó PNY GeForce RTX 4070 Ti SUPER 16GB OC XLR8
- Lenovo ThinkCentre M720s SFF / M920T tower -Számla, garancia, WIN11
- ÁRGARANCIA!Épített KomPhone Ryzen 7 7800X3D 32/64GB RAM RTX 4070Ti Super GAMER PC termékbeszámítás
- Bomba ár! HP ProBook 450 G7 - i5-10GEN I 16GB I 256SSD I HDMI I 15,6" FHD I Cam I W11 I Gar
- ÁRGARANCIA!Épített KomPhone Ryzen 7 5800X 32/64GB RAM RX 7800 XT 16GB GAMER PC termékbeszámítással
- Csere-Beszámítás! Gamer PC Számítógép! R9 3900X / RX 6700XT / 32GB DDR4 / 1TB SSD
Állásajánlatok
Cég: Promenade Publishing House Kft.
Város: Budapest
Cég: CAMERA-PRO Hungary Kft
Város: Budapest