| Autor | Zpráva | ||
|---|---|---|---|
| ServIT Profil |
#1 · Zasláno: 6. 1. 2017, 08:11:36
Zdravím,
Zkoušel jsem spatlat nějakou funkci, kterou by šlo naroubovat na onfocus událost, která by hlídala jak jak dlouho se obsah pole nezmění a po uřčité době vyvolá akci .. chtěl jsem to použít na interaktivní filtr dat. V tabulce data, nad tabulkou textové pole. začnu psát, ale nepotřebuju, aby po každém klepnutí došlo k obnovení tabulky, ideálně řekněme sekundu a půl po přerušení psaní. Prosím o posouzení, zda můj myšlěnkový sled není v konfliktu s filozofii prohlížeče a ... třeba se to dá napsat jednodušeji. Nevím. JQuery neumím, pro člověka který sotva zná JS, ( já) je používání této lokomotivy nepřehledné. Snad časem. Funkce neni úplně doladěná, ale ve Firefoxu nejspíše dělá, co od ní čekám. V konzoli žádné errory a pokud mohu soudit, chování odpovídá mému očekávání. V ukázce není zpracována hodnota time (jakési určení, toho intervalu, ještě to nemám dokoumané, proto jsem to nechal viset ... Za vaše náměty předem díky. Milan function setWatch( evt, time ) {
var obj = evt.target
var obj_old_val = obj.value;
var is_changed = false;
var pause_timer = 0;
var incr_value=function(){
pause_timer = pause_timer + 1;
}
var obj_watcher = setInterval( function() {
var obj_value = obj.value;
if( obj_value.length < 3 ){
return true;
}
if( obj_value == obj_old_val ){
if( ! is_changed ) return true;
incr_value();
if( pause_timer > 5 ){
clearInterval( obj_watcher );
alert( " UUUUžžž" );
}
} else {
pause_timer = 0;
obj_old_val = obj_value;
is_changed = true;
}
}, 300);
obj.removeAttribute("onblur");
obj.addEventListener("blur", function(){ clearInterval( obj_watcher )} ) ;
}<input type="text" name="ps]" onfocus="setWatch( event, 3 )" |
||
| Martin Heralecký Profil |
ServIT:
Já bych to udělal nějak takto: příklad zde <input type="text" id="input">
<script>
// sem uložím timer, abych ho později mohl event. zrušit
var timer;
// při stisku jakékoli klávesy...
$('#input').keydown(function()
{
// zruším timer (pokud vůbec existuje)
clearTimeout(timer);
// vytvořím nový
// - za 1 sekundu se má zobrazit hláška
// - pokud do té doby uživatel stiskne nějakou klávesu, tento timer se zruší
// a pojede odznovu, viz. příkaz clearTimeout
timer = setTimeout(function()
{
// načtení/filtrování...
}, 1000);
});
</script> |
||
| ServIT Profil |
#3 · Zasláno: 6. 1. 2017, 22:09:26
Zdravím .. děkuji za reakci, ale
keydown neřeší myší vložení. Třeba na linuxu vkladam pouze středním tlačítkem myši. Těch problémů je s fixací na klávesy více, onfocus - onblur je jistota, řekl bych. jQuery .. neumím .. vlastně pořád bloudím v samotné podstatě JS. JS je dělán určitým způsobem, má své klady a zápory, své "postupy" a "přístupy" .. až se v tom zorientuju, snad jQuery ( jako "vyšší dívčí JS" ) přimu za svůj nástroj. Můj postup má jednu "vlastnost" (řekl by B. Gates) .. pokud něco do pole napíšu a rychle vyskočím, akce se nevykoná. možná by to šlo ošetřit v onblur funkci, ale toto mne teď netrápí. Spíše se bojím, že je to špatné navržené .. že spuštěná funkce zůstane viset v paměti nebo tak něco ... síce je to drobeček, ale jde o princip ... jo a ta akce, která se provede, po timeoutu musí tedy už z princípu být ajaxovina, Jinak by se ztrácel fokus, kdyby se načítala celá stránka ... ale ajax není problém, něco jsem kdysi odkudsi obšlehnul a přepsal na takového mastodonta, který umí lecjaké fintičky. |
||
| Keeehi Profil |
#4 · Zasláno: 7. 1. 2017, 01:31:06
ServIT:
„keydown neřeší myší vložení“ Někde jsem našel, že pokud tu akci navážeš na události propertychange change click keyup input paste, tak by to mělo pokrýt všechny možnosti při kterých se hodnota inputu může změnit. Jinak je to řešení od Martin Heralecký hezké a funkční a proto bych použil to.
|
||
|
Časová prodleva: 3 dny
|
|||
| ServIT Profil |
#5 · Zasláno: 10. 1. 2017, 08:29:54
Děkuji všem za náměty, přesto mi připadá, že řešení p. Hradeckého v sobě skrývá "pastičky", jejichž obejítí by nebylo snadné, a hlídat 8 eventů na jednom prvku, kdy budu posuzovat vložení textu z myši + dopsání něco klavesnici ( v daném intervalu ) .. brrr. KeyUb vyvolá i šipka ..
Co je vadného na tom, když po fokusu proste cyklicky sleduji obsah pole, a po pěti ně-změnách tu hodnotu zpracuji. I tady musím pohlídat několik drobností, ( např. byl původní nebo nový obsah aspoň třípísmenný ? /* abych filtr taky uměl vynulovat */ , než začnu hlídat ne-změnu, musím počkat na změnu /* ať se mi událost neodpaluje prostým zafokusováním */ a pod. ) ale to mi příjde programátorsky triviální. Když chci hlídat změnu obsahu, proč odchytávat 7 událostí, a žonglovat s nimi ? prostě hlídám ten obsah, ne ? Jaký je v tom problém ? Možná v jQuery by to byl masakr, zatímco vaše řešení /* ta nejjedoduší varianta */ se dá spytlíkovat na jeden řádek ( ? ). Nevím, zajímá mně to. Díky, Milan |
||
| Keeehi Profil |
#6 · Zasláno: 10. 1. 2017, 11:47:37
ServIT:
„Když chci hlídat změnu obsahu, proč odchytávat 7 událostí, a žonglovat s nimi ?“ Ono je úplně jedno, jestli je na tom prvku navázána jedna událost nebo sedm. Protože kód jejich obsluhy je stejný. Jediná nutná změna tedy v kódu z [#2] by byla na řádku s $('#input').keydown(function()
<input type="text" id="input">
<script>
var timer;
$('#input').on('propertychange change click keyup input paste', function()
{
clearTimeout(timer);
timer = setTimeout(function()
{
// načtení/filtrování...
}, 1000);
});
</script> |
||
| _es Profil |
#7 · Zasláno: 10. 1. 2017, 11:56:47
ServIT:
Ešte môžeš použiť udalosť oninput. Tu máš k tomu celý článok, aj s inými informáciami vzťahujúcimi sa k téme: JS událost oninput
|
||
| ServIT Profil |
#8 · Zasláno: 10. 1. 2017, 18:20:12
_es:
Pěkný, ale oninput až na nových prohlížečích. Bohužel, naše pokladní PC s FF 2.1 se nelepí. |
||
| _es Profil |
#9 · Zasláno: 10. 1. 2017, 18:43:32
ServIT [#8]:
Podľa dokumentácie Mozilly by to malo fungovať od druhej verzie Firefoxu: GlobalEventHandlers.oninput » Browser compatibility |
||
|
Časová prodleva: 20 dní
|
|||
| ServIT Profil |
#10 · Zasláno: 30. 1. 2017, 14:32:08
Tak jsem oninput vyzkoušel na jiném místě, a je to fakt asi nejlepší událost, kterou lze použít na sledování obsahu.
Díky |
||
|
Časová prodleva: 7 let
|
|||
0