Z času na čas, počas takého kľudného programovania, sa môže objaviť nejaký malý problém, ktorý treba vyriešiť.
Ak je riešenie opakovateľne aplikovateľné a využiteľné aj pri iných podobných situáciách, u mňa realizácia skončí implementáciou tzv. helper metódy.
Na tomto mieste by som sa chcel podeliť o moje riešenia týkajúce sa javascriptu. Možno niekomu pomôžu a uľahčia mu prácu, prípadne prostredníctvom
konštruktívnych pripomienok budem môcť aj ja sám vylepšiť existujúce riešenia.
Vyvolanie udalosti na html elemente
V ostatnom čase sa dosť intenzívne venujem javascript-ovému framework-u dojo. V aplikácii, v ktorej sa v značnej miere využíva widget
dijit.Tooltip sa tento prestal skrývať po odídení
kurzora myšky z daného html prvku, ak na tento prvok bolo predtým kliknuté. Prvok si stále držal focus a tooltip ostával zobrazený.
Po pátraní po internete som zistil, že nie som jediný, kto má problém so správnym skrývaním, respektíve zobrazovaním, tooltipu. Skúsil som rôzne
navrhované riešenia, ktoré do istej miery znásilňovali daný widget, ale žiadne z nich nezabralo v mojom prípade. Po preskúmaní správania sa widgetu a html prvkov
na ktoré bol aplikovaný, som prišiel na riešenie, ktoré zafungovalo. Bolo potrebné "násilne" vyvolať udalosť "blur" nad html elementom, pre ktorý
bol tooltip vytvorený. A tu je finálna implementácia fireEvent metódy:
|
function fireEvent(element, event) {
if (typeof (event) !== "string") {
throw new TypeError("Input event name must of type string.");
}
if ((typeof (element) === "undefined") || (element == null)) {
throw new Error("Element can not be null.");
}
// IE
if (document.createEventObject) {
var evt = document.createEventObject();
return element.fireEvent("on" + event, evt);
}
// Ostatne prehliadace
var evt = document.createEvent("HTMLEvents");
// Inicializacia eventu (Event type, bubbling, cancelable)
evt.initEvent(event, true, true);
return !element.dispatchEvent(evt);
};
|
|
Metóda pre vyvolanie udalosti nad html elementom
|
Distinct metóda pre polia
Na inom mieste som potreboval získať zo vstupného poľa len distinct-né prvky, a už trocha zdeformovaný zo C#-pu som hneď písal pole.distinct(). Čuduj sa svete, error ;-).
Tak som nakoniec rozšíril Array objekt o metódu distinct takto:
|
(function () {
if (!Array.prototype.distinct) {
Array.prototype.distinct = function () {
var distinctArray = [];
for (var i = 0; i < this.length; i++) {
if (distinctArray.indexOf(this[i]) === -1) {
distinctArray.push(this[i]);
}
}
return distinctArray;
}
}
})();
|
|
Distinct metóda pre Array objekt
|