- AMD K6-III, és minden ami RETRO - Oldschool tuning
- Nem kell még temetni: 2 éves órajelcsúcsot döntöttek meg Raptor Lake-kel
- Projektor topic
- Milyen videókártyát?
- Fejhallgató erősítő és DAC topik
- A Linux megnégyszerezte magát a Steamen — a Microsoft ismét ígérget
- AMD vs. INTEL vs. NVIDIA
- Először kombinálja a Full HD-t az 1000 Hz-cel egy monitor
- AMD Navi Radeon™ RX 9xxx sorozat
- Speciális kiadású AMD-s alaplapot villantott az ASUS a 20 éves ROG-jubileumra
-
PROHARDVER!
PROHARDVER!
Új hozzászólás Aktív témák
-
De a JavaScript nem így működik. A JS egy szálon fut. Ha valami külső dologra (async) kell várnia, akkor nem állhat le. Ugrik a következő sorra. Hát gondolj bele, ha valami hiba történne, vagy lassú lenne a net, akkor addig állna, míg be nem tölt valamit? És az állt úgy kell érteni, hogy addig semmit sem tudsz csinálni. Épp ezért egy ilyen asyncron kérés visszatér egy promissal, ami ha resolválódik. (Teljesül az ígéret) akkor meghívja a jövőben azt a függvényt, ami erre várt.
Az általad hozott példát valahogy így lehetne használni:
function getPage (url) {
'use strct';
return new Promise((resolve, reject) => {
const httpLibrary = url.startsWith('https') ? require('https') : require('http');
httpLibrary.get(url, (response) => {
const body = [];
response.on('data', (chunk) => body.push(chunk));
response.on('end', () => resolve(body.join('')));
}).on('error', (error) => {
console.log('Error!', error.message);
});
});
}
getPage('http://vanenet.hu').then((html) => doWhateverYouWantWithHTML(html));
function doWhateverYouWantWithHTML (html) {
console.log(html);
}A doWhateverYouWantWithHTML-be írod amit szeretnél csinálni, és ez akkor hívódik meg, mikor betöltődött sikeresen a page, amivel meghívtad a getPaget.
Szerk.: De ahogy látom Jim-Y fórumtárs is erre próbált fentebb rávezetni, egy hasonló példával.
Tényleg olvasgass a témában, nem feltétlen egyszerű, de mindenkinél van egy pillanat mikor átkattan és megérti.Még annyi, hogy a 2. sort elírtam
'use strict';természetesen. -
Köszi!
És ha a
doWhateverYouWantWithHTMLnem function, hanem kód? Mert pont ez a problémám. Nem csak egyszer, egy link esetében szeretném feldolgozni az adatokat, hanem több helyen. Ahol mindegyik linknek más a kódja, tehát másnak kell lefutnia. Amit nem tudok function-be tenni... Konkrétan pl replace-t, vagy splitet szeretnék a változókon végrehajtani.Nem akarom én ezt túlbonyolítani... A lényeg, hogy van egy függvényem, annak küldök egy linket, majd egy DATA változóban visszatér a HTML kódja az adott oldalnak. Erről a HTML oldalról pedig megint leszedek egy link HTML-t, azt is feldolgozom stb...
Ja és van amikor a több link közt case-t is használok, hogy eldöntse a forráskód alapján, hogy éppen melyiket kell használnia... Namost ezt egy functionbe beilleszteni átláthatatlan lenne és újra kéne írnom a már xhr sync-kel működő viszonylag hosszú kódot.
A function is kód.
De sejtem mire gondolsz és akkor valami ilyesmi kell neked:
getPage('http://page1.hu').then((html) => doWhateverYouWantWithPage1(html));
getPage('http://page2.hu').then((html) => doWhateverYouWantWithPage2(html));
getPage('http://page3.hu').then((html) => doWhateverYouWantWithPage3(html));
function doWhateverYouWantWithPage1(html) {
// code1
}
function doWhateverYouWantWithPage2(html) {
// code2
}
function doWhateverYouWantWithPage3(html) {
// code3
}Sokáig lehet ezt ragozni, de más megoldás erre nincs, a JS így működik. És azt is elhiheted, hogy ez a logikus és átlátható mód. Ha nem tetszik, akkor csinálhatod PHP-val és CURL-el mondjuk.
-
De én pont nem ezt szeretném. A függvény csak "kódrövidítés" szempontjából lenne szükséges. És nem a függvényen belül szeretném az adatokat kiíratni, hanem "kint".
Illetve nem alerteket, hanem elég hosszű replace-ket regex-ekkel használnék...
S ezt a getPage-t én csak a HTML kód leszedésére használnám. Nem egyszer, hanem sokszor a kódban...
Egyébként kinek az ötlete volt egy get kérést aszinkronnak keresztelni? Ott a legtöbb esetben pont az a lényeg, hogy megvárja, míg végez a letöltés... És ez eddig minden programnyelvben, amivel eddig találkoztam mind így volt. De ha callbackkel meg lehet csinálni, kérem valaki dobjon már össze egy példát nekem, ami stimmel a leírásomra! Nagyon hálás lennék!
-
Egyébként hogy lehet az, hogy a console.log(str); kiírja a HTMl kódot itt, de a DATA globális változóba már nem tudja belementeni?:
var DATA = '';
function getPage(url){
var http = require("http");
content = http.request({ url: url, method: "GET" }).then(function (response) {
str = response.content.toString();
console.log(str);
DATA = str;
}, function (e) {
alert("Error!");
});
}
getPage('http://vanenet.hu');
alert(DATA);Na, itt az utolsó
alert(DATA);már üres...
#6331
Nem, nem használok express-t. Sima nativescript.
-
Ennél a megoldásnál téged nem érdekel pontosan mennyi mezője van a data objektumnak. Végigmész az összesen, ellenőrzöd, hogy saját mezője-e, majd a kapott értéket a mező nevéből származó index-szel berakod egy tömbbe.
Egy egyszerű minta: fiddle. Egy kicsit korrektebb: változat.
"Az én megoldásomnál az lehet a hiba, hogy a "data.d0" objektumot String-ként hozom létre, és azt nem tudja értelmezni?"
Bizony, a legfőbb hiba ez. A másik, hogy nem rugalmas a megoldás, hiszen mi van, ha már nem 90 elemet kell feldolgozni?
Ha errefelé mennél mégis, amit nem ajánlanék, akkor valahogy így módosulna a fenti egyszerű példa.
A lényeg:
var arr = []; // eredmény
for (var i = 0; i <= 90; i++) {
var key = "d" + i;
arr[i] = data[key]; // a data objektum adott d0 .. d90 elemét így tudod megcímezni
} -
CSorBA
őstag
Hát basszus, most nézem, tök igazad van, én meg tök hülyeségeket beszéltem, elég durván felületesen néztem meg, látszik az aznapi tevékenységemen a 3 óra alvás
.
Mondjuk ettől még tényleg ratyi az a regexp. Eleve furcsa, hogy az <input rész beleírásától miért félt következetesen.
Pl. ez illeszkedik arra az undormány regexpre (a form szigorúan nagybetűvel kezdődjön):
<Form method="POST" action=''><input name="op" value="asdasd" /><input name="id" value="asdasd" /><input name="fname" value="asdasd" /><input name="hash" value="asdasd" />(#5803) w.miki:
Kódminőségben biztos tudnánk szebbet... ha akarnánk.
(#5804) TheProb:
Heh, milyen fura, még a HTML5 előtti időkből benne ragadt a fejemben, hogy az id csakis akkor valid, ha BETŰVEL kezdődik, a számmal kezdődőek nem azok - de most nézem, HTML5-től kezdve már sima szám is lehet id - sőt, igazából minden (ha nem üres), ha valóban egyedi és nem tartalmaz whitespace-t.(#5809) trisztan94:
"A programozásban nincs olyan, hogy valami egyszer működik, egyszer nem."
Mi? Hát már hogyne lenne? Olyan szép esetek vannak ilyesmikre, a kedvencem az a fajta hiba, ami debuggolás során nem tapasztalható, csak éles működés során. És erre persze csak elképesztő sok időelkúrás után jössz rá, miután már úgy érzed, hogy végigdebuggoltad az egész világegyetemet, aztán kezdheted vakarni a fejedet, hogy vajon akkor a nem debug módban futás során vajon mi történik, egyszerűen időbeli tényező az oka, vagy netán a többszálú működés alkalmazásodban tapasztalható indeterminizmusa, vagy valami eltérő hardverkörnyezetből előkerülő érdekesség, vagy...vagy...satöbbisatöbbi.Mindenkivel előfordul
Szerintem arra számíthatott, h. ott lehet id, class ilyesmi egyéb attribútum is.
-
Pure JS-el mennyire nevezhető ez a megoldás kulturáltnak, ha az összes li elem színét akarom változtatni?
var listElements = document.querySelectorAll("li");
for(var i = 0; i < listElements.length; i++){
listElements[i].style.color = "rgb(" + currRed +
", " + currGreen + ", " +currBlue + ")";
}Van ennél ortodoxabb, szebb megoldás?
-
Sziasztok!
Mi a probléma a következő kódban? [link]
Lényeg, hogy be lehet írni az egyes cellákba bármit, majd a gombra kattintva meg kell adni egy stringet amit szeretnénk megkeresni a cellákban, egzakt. De vmiért az istenért nem lép bele az egymásba ágyazott for-ban lévő if-be...Debugban megnéztem és az értékeket helyesek és ha összehasonlítom őket akkor jól is adja vissza a logikai értéket.
Ha debugban megnézted, akkor a konzolt is látnod kellene
TypeError: document.getElementById(...) is nullMéghozzá itt: aktCella = document.getElementById(i+j).value;
Egész egyszerűen nincs olyan id-jű elem a kódodban amit le akarsz kérdezni, ezért nincs neki value-je és ezért itt elhasal az egész. Ellenőrizni kellene az elem meglétét, mielőtt value-t kérdezel.
-
CSorBA
őstag
Ebben a pluginben katasztrofális hülyeségek is vannak, ahogy elnézem, pl. ez:
var param = showtime.httpReq(path).toString().match(/<Form method="POST" action=''>[\S\s]*?name="op" value="([\S\s]*?)"[\S\s]*?name="id" value="([\S\s]*?)"[\S\s]*?name="fname" value="([\S\s]*?)"[\S\s]*?name="hash" value="([\S\s]*?)"/);
Hát ez nem tudom, milyen reguláris kifejezés akar lenni, ami direkt nem illeszkedik SEMMIRE?
(Legalábbis erre illeszkedő stringet értelmes+hozzáértő ember nem ír le.) Vagy-jel nélkül fordul elő benne többször is adott attribútum, amire vizsgálódni akar (pl. name, value), szóval ez tuti sosem fog illeszkedni semmilyen stringre.Ezenkívül borzalmasan elavult és gány az egész kód, pl. a <font> tag ezer éve deprecated HTML-ben, JS-ben eval()-t használ, amit nem illik, meg még lehetne sorolni, de a lényeg, hogy spagettikód hatása van az egésznek, szóval nehézkes lesz ezt javítani: a gond az, hogy szerintem most hirtelen nehezen fogsz találni olyat, aki tudja debuggolni neked ezt az éles környezetében, és kideríteni, hogy mi pontosan miért nem működik. Ettől függetlenül ha elmondod, pontosan mikre is lenne még szükséged az indavideón kívül, amit használnál, de nem működik, akkor azt meg tudjuk nézni, és megmondani, mi lehet a gond vele.
Ez annyira szörnyen néz ki, hogy megnéztem. Ez fog illeszkedni, méghozzá olyan Form-ra, amiben van op, id, fname, hash input, és ezek értékeit szedi ki. Az inputok között lehet más input is. Erre persze .*-ot szokás használni, de végül is ennek megfelelője a [\S\s]*.
Gondolom aki írta nem értett a regexhez és valahonnan ezt sikerült kiguglizni,Amúgy [^"]*-ot kellett volna használni a value-kban, a köztes helyeken meg mondjuk .*?-ot.
-
CSorBA
őstag
-
CSorBA
őstag
Meg sem szólalok, nem tudom miért nem így használtam.
Köszönöm szépen!szerk.: @4606 igen, természetesen csak fiddlen hagytam ki, kódban rendben van.
-
CSorBA
őstag
Pont nemrég írt róla:
http://prohardver.hu/tema/javascript_topic/hsz_4249-4249.html
Igazából nagyon röviden annyi a gond vele, hogy bizonyos helyzetekben a kódírás vagy épp kódolvasás során nem egyértelmű, egész pontosan mire is vonatkozik a this, ezt el lehet kerülni azzal, ha még "időben", a megfelelő helyen átadod a this-t egy beszédes változónak, vagy például eseménykezelőkben az event.targetet, event.currentTargetet, stb. használod.Azért persze olyan nagyon démonizálni sem kell, például egy rövid eseménykezelőben nincs baj belőle, ha a this-t használod (vagy $(this)-t), ha az elég egyértelmű, viszont ha már picit bonyolódik a helyzet, érdemes egyértelműbbé tenni a kódot (az olvashatóság és a helyes működés érdekében is). Azért mondjuk a kód jobb, ha minden tekintetben következetes.
Sk8erPeter @ 4556:
Köszi, illetve Jim-Y-nek is az összefoglalójáért.Zedz @ 4556:
"valószínűleg juniorként még egy darabig nem is leszek"Hehe, ebben sosem lehetsz biztos. Én mikor tavasszal a jelenlegi munkahelyemen kezdtem juniorként, a következő héten pont az alábbiakkal kellett megismerkednem: Grunt, Yeoman, Bower. Ráadásul én az összes programozási tudásom közül, mindig a js-el álltam kicsit hadilábon, és ha már itt tartunk, a mai kérdés:
All:
Probléma: jsfiddle: ow2xow84 (Ugye a child elementeken is ellövődik.)
Megoldás: jsfiddle: o8f5hy6mEnnél jobb javaslat?
-
Ez igy nem lesz jo, mert a this, az egy HTMLElement annak meg nincs toggleClass metodusa, szerintem inkabb $(this).toggleClass, de ez meg antipatter, $(this)-t nem hasznalunk, szoval marad a $(event.currentTarget).toggleClass()
"$(this).toggleClass, de ez meg antipatter, $(this)-t nem hasznalunk, szoval marad a $(event.currentTarget).toggleClass()"
Erről tudnál kicsit mesélni? Érdekelne
-
Nagyon jó móka, és kiválóan alkalmas a kevés szabadidőd elszúrására
Röviden arról van szó, hogy valaki kitalál egy feladványt, megírja hozzá a unit testeket, és neked olyan kódot kell írni, ami átmegy a teszteken (természetesen a teszteket, valamint mások megoldásait csak azután ismered meg, miután megoldottad a feladatot).Érdemes megnézni mások megoldásait, lehet belőlük tanulni. És persze hirtelen ötlettől vezérelve, pusztán szórakozásból lehet alkotni tömör, de lassú és erőforrás-pocsékoló, tökéletesen karbantarthatatlan kódot, mint a for ciklustól mentes Base64 megoldásom
Ooóóó, ez tök jó oldal. Tök sokat lehet abból tanulni, hogy látod más hogy csinálta meg. Ez tetszik
-
CSorBA
őstag
Sziasztok, belevetettem magam a jQuerry-be és máris akadályba ütköztem... nem nagyon akar megmozdulni az a div...
Ok, módosítom a kérdésem... mi a baj a "this"-el... mert, hogy anélkül megy...
-
Legyszi oszd meg a teljes kododat, mert elkepzelheto, hogy te a javascript kodot a body vegen adtad hozza, es az onClick nem letezik meg akkor, mikor rakotod az onclick esemenyre.
Masik hiba, hogy ha igy hivsz meg egy metodust, akkor nincs hidden event metodus, azt az addEventListener teszi hozza a hatterben.
Harmadik hiba, hogy nehezen modosithatova teszed a kodot azzal, hogy az esemenyt a html-ben definialod es nem a js-ben, ahogy azt kene, illetve ahogy erre mar kaptal peldakodot is tolem, es Sk8erPeter-tol is.
Peldaul csereld ki a kododban:
<img id="1" class="small" alt="Small img" src="imgs/1.jpg" onclick="onClick(this.id)"></img>
function onClick(id) {
console.log(id);
}Es egybol meglesz az id.. de ha ezt ugy csinalnad, ahogy kene (nem biztos, hogy ez lenne a legjobb modszer, de a jelenlegidnel jobb):
Gondolj bele, ez mar csak azert is jobb, mert ha onclick eseten tobbe mar nem az onClick()-et akarod futtatni, akkor nem kell annyi helyen belenyulni a html kodba, ahany keped van
<img id="1" class="small" alt="Small img" src="imgs/1.jpg" onclick="onClick(this.id)"></img>
<img id="2" class="small" alt="Small img" src="imgs/1.jpg" onclick="onClick(this.id)"></img>
<img id="3" class="small" alt="Small img" src="imgs/1.jpg" onclick="onClick(this.id)"></img>
<img id="N" class="small" alt="Small img" src="imgs/1.jpg" onclick="onClick(this.id)"></img>Itt most N-szer kene atirni, mig az en verziomban egy helyen atirod a kodot, es kesz.
Nem veletlenul best-practise az, hogy HTML-be NEM irunk javascriptet, ha ez megoldato, es JS-be NEM irunk CSS-t ha ez megoldhato.
-
Most jött el a kérdés ideje ezzel a hozzászólással kapcsolatban
Azt vettem észre, hogy click eventnél ez teljesen jól működik, viszont scroll esetében valamiért nem fut le, csak direktben pakolva. De az pedig ugye nem lesz jó a később behozott elemek esetén..
Itt a példám: [link] Mi a gond a scrollal?
-
CSorBA
őstag
Hi! Az események buborékszerű felszivárgásáról itt írtam, belinkelve egy példát:
http://prohardver.hu/tema/weblap_keszites/hsz_10515-10516.html
http://prohardver.hu/tema/weblap_keszites/hsz_10543-10543.htmlAz AJAX-os betöltött elemekre kötött event handlerekre jó példa a jQuery.on(), ahol a "delegated events" rész az érdekes, itt tök jól elmagyarázza a helyzetet (kiemeltem a nagyon fontos részeket):
"Delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time. By picking an element that is guaranteed to be present at the time the delegated event handler is attached, you can use delegated events to avoid the need to frequently attach and remove event handlers. This element could be the container element of a view in a Model-View-Controller design, for example, or document if the event handler wants to monitor all bubbling events in the document. The document element is available in the head of the document before loading any other HTML, so it is safe to attach events there without waiting for the document to be ready.
In addition to their ability to handle events on descendant elements not yet created, another advantage of delegated events is their potential for much lower overhead when many elements must be monitored. On a data table with 1,000 rows in its tbody, this example attaches a handler to 1,000 elements:
$( "#dataTable tbody tr" ).on( "click", function() {
alert( $( this ).text() );
});A delegated-events approach attaches an event handler to only one element, the tbody, and the event only needs to bubble up one level (from the clicked tr to tbody):
$( "#dataTable tbody" ).on( "click", "tr", function() {
alert( $( this ).text() );
});[...]
Attaching many delegated event handlers near the top of the document tree can degrade performance. Each time the event occurs, jQuery must compare all selectors of all attached events of that type to every element in the path from the event target up to the top of the document. For best performance, attach delegated events at a document location as close as possible to the target elements. Avoid excessive use of document or document.body for delegated events on large documents.
jQuery can process simple selectors of the form tag#id.class very quickly when they are used to filter delegated events. So, "#myForm", "a.external", and "button" are all fast selectors. Delegated events that use more complex selectors, particularly hierarchical ones, can be several times slower--although they are still fast enough for most applications. Hierarchical selectors can often be avoided simply by attaching the handler to a more appropriate point in the document. For example, instead of $( "body" ).on( "click", "#commentForm .addNew", addComment ) use $( "#commentForm" ).on( "click", ".addNew", addComment )."
Itt tehát a példában az eseménykezelőt a tbody-ra kötötte, ahelyett, hogy az összes tr-re tette volna ugyanezt, így az eseménynek csak pontosan egy szintet kell buborékszerűen felúsznia, a klikkelt tr elemből a tbody felé.
Ide felraktam egy egyszerű példát:
http://jsfiddle.net/Sk8erPeter/Tpc3k/
itt például gombokat adok hozzá egy container elemhez. Az első példában csak az első gomb "reagál" (dob alert() ablakot), mert konkrétan a kód lefutásának pillanatában jelenlévő button elemre kötöttem az event handlert; a második esetben viszont amikor hozzáadok újabb gombokat, azok is dobnak alert()-ablakokat, hiszen ott azt határoztam meg, hogy a szülőelemre legyen kötve az event handler (egyébként itt a lényeg a hierarchia, nem az, hogy közvetlen szülőeleme legyen!), és megadtam egy selectort is (ami a "button"), hogy a leszármazott elemek közül ezekre szűrjön az eseménykezelés során, ezek triggereljék a click eseményt.
Lásd a doksiban a leírást a selectorra:
selector
Type: String
A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.Tehát a különbség:
első:
$container1.find('button').on('click', function (event) { ... } );
második:
$container2.on('click', 'button', function (event) { ... } );Remélem, nagyjából érthető, ha valami nem tiszta, mert bonyolultan írtam, kérdezz nyugodtan
Most jött el a kérdés ideje ezzel a hozzászólással kapcsolatban
Azt vettem észre, hogy click eventnél ez teljesen jól működik, viszont scroll esetében valamiért nem fut le, csak direktben pakolva. De az pedig ugye nem lesz jó a később behozott elemek esetén..
Itt a példám: [link] Mi a gond a scrollal?
-
CSorBA
őstag
Hi! Az események buborékszerű felszivárgásáról itt írtam, belinkelve egy példát:
http://prohardver.hu/tema/weblap_keszites/hsz_10515-10516.html
http://prohardver.hu/tema/weblap_keszites/hsz_10543-10543.htmlAz AJAX-os betöltött elemekre kötött event handlerekre jó példa a jQuery.on(), ahol a "delegated events" rész az érdekes, itt tök jól elmagyarázza a helyzetet (kiemeltem a nagyon fontos részeket):
"Delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time. By picking an element that is guaranteed to be present at the time the delegated event handler is attached, you can use delegated events to avoid the need to frequently attach and remove event handlers. This element could be the container element of a view in a Model-View-Controller design, for example, or document if the event handler wants to monitor all bubbling events in the document. The document element is available in the head of the document before loading any other HTML, so it is safe to attach events there without waiting for the document to be ready.
In addition to their ability to handle events on descendant elements not yet created, another advantage of delegated events is their potential for much lower overhead when many elements must be monitored. On a data table with 1,000 rows in its tbody, this example attaches a handler to 1,000 elements:
$( "#dataTable tbody tr" ).on( "click", function() {
alert( $( this ).text() );
});A delegated-events approach attaches an event handler to only one element, the tbody, and the event only needs to bubble up one level (from the clicked tr to tbody):
$( "#dataTable tbody" ).on( "click", "tr", function() {
alert( $( this ).text() );
});[...]
Attaching many delegated event handlers near the top of the document tree can degrade performance. Each time the event occurs, jQuery must compare all selectors of all attached events of that type to every element in the path from the event target up to the top of the document. For best performance, attach delegated events at a document location as close as possible to the target elements. Avoid excessive use of document or document.body for delegated events on large documents.
jQuery can process simple selectors of the form tag#id.class very quickly when they are used to filter delegated events. So, "#myForm", "a.external", and "button" are all fast selectors. Delegated events that use more complex selectors, particularly hierarchical ones, can be several times slower--although they are still fast enough for most applications. Hierarchical selectors can often be avoided simply by attaching the handler to a more appropriate point in the document. For example, instead of $( "body" ).on( "click", "#commentForm .addNew", addComment ) use $( "#commentForm" ).on( "click", ".addNew", addComment )."
Itt tehát a példában az eseménykezelőt a tbody-ra kötötte, ahelyett, hogy az összes tr-re tette volna ugyanezt, így az eseménynek csak pontosan egy szintet kell buborékszerűen felúsznia, a klikkelt tr elemből a tbody felé.
Ide felraktam egy egyszerű példát:
http://jsfiddle.net/Sk8erPeter/Tpc3k/
itt például gombokat adok hozzá egy container elemhez. Az első példában csak az első gomb "reagál" (dob alert() ablakot), mert konkrétan a kód lefutásának pillanatában jelenlévő button elemre kötöttem az event handlert; a második esetben viszont amikor hozzáadok újabb gombokat, azok is dobnak alert()-ablakokat, hiszen ott azt határoztam meg, hogy a szülőelemre legyen kötve az event handler (egyébként itt a lényeg a hierarchia, nem az, hogy közvetlen szülőeleme legyen!), és megadtam egy selectort is (ami a "button"), hogy a leszármazott elemek közül ezekre szűrjön az eseménykezelés során, ezek triggereljék a click eseményt.
Lásd a doksiban a leírást a selectorra:
selector
Type: String
A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.Tehát a különbség:
első:
$container1.find('button').on('click', function (event) { ... } );
második:
$container2.on('click', 'button', function (event) { ... } );Remélem, nagyjából érthető, ha valami nem tiszta, mert bonyolultan írtam, kérdezz nyugodtan
Éreztem én, hogy téged kell megszólítani
Szerintem lassan összedobhatnánk a fórumtársakkal egy sörözést és neked pár sört Nagyon hasznos leírás, letisztult a kép azt hiszem. Még talán annyi, hogy ugye jQueryben az onclick is valójában .on?
-
A dolog egyrészt egyszerű, másrészt nem.
Van ugyebár a DOM-unk, aminek egy MEGLÉVŐ elemén ha elsül valahol egy esemény, az szépen elkezd fölfelé "bugyogni" a szölő elemein végig.Feladat tud lenni, ennek a felfelé bugyogásnak a megszüntetése, mert nem várt mellékhatásokat okozhat. Pl: egy formot ajaxosan akarsz elküldeni. A submit gomb click-jére feliratkozva hiába csinálsz valamit, ha az esemény tovább bugyog, és végül a default böngészős viselkedés fog elsülni rá, azaz elnavigál az oldal a Form url-jére. Ekkor a click elkapásakor egyúttal meg kell szüntetni a tovább bugyogást is.
A másik típusú gond ott kezdődik, hogy eseményt kötni csak MEGLÉVŐ elemekre lehet, olyanokra nem amiket ajax-al utólag fogsz beszúrni valahova, és az esemény handler létrehozásakor még sehol sincs.
Ekkor sincs gond, csak éppen más módszerrel kell lekezelni ezeket az eseteket.
-
CSorBA
őstag
Sziasztok!
Egy kis segítséget kérnék, és ha szabad így megszólítanom Sk8erPeter fórumtársat, akkor az Ő hozzászólására kiemelten számítok
Szóval a Javascript bubbling and capturing-ról tudnátok mesélni? Kicsit zavarosan az angol leírások. Akár jquery példát hozva, valaki el tudná magyarázni, hogy ez miért jó? Miért és hogy jobb szülőre bindelni eseményt? - Ha jól tudom ezt ajaxos betöltődésnél lehet kihasználni, hogy nem kell újrabindelni a bekért DOM elemekre, hanem elég egy szülőre. De ez gyakorlatban hogy valósul meg, leginkább ez érdekelne.
-
A HTML+js+css kombó, már sokan sokfelé megmondták, hogy a vicc kategória. Minél komolyabban használod, annál tragikusabb.
Másrészt mindenen elfutnak, és ha nem kell bennük megváltani a világot, akkor azért tűrhető energia befektetéssel ki lehet hozni belőlük elég sokat. Ráadásul ha ilyen ütemben fejlődnek (plusz a böngészők, mobil eszközök beépített böngészői is), akkor tényleg ez lesz a jövő. A html+js+css kombó közül mostanra egyértelműen a js a leggyengébb láncszem, erre nagyon ráférne egy alapos ráncfelvarrás.Ezzel egyetértek.
A CSS-ben is igen sok lehet. Volt szerencsém nemrégiben egy html alapú alkalmazást fejleszteni, aminek csak egy adott (értelemszerűen modern) böngészőn kell futnia. Annyira jól esett, hogy nem kellet fallbackelni, nyugodtan használhattam a CSS3 teljes tárházát. Talán egyszer eljön ez az idő a teljes webes környezetben -
ja, hogy nem a példával volt a baj, hanem a javascripttel? Kivételesen ebben is tökéletesen egyetértek a tanárral.
Mára minden hülye a Jquery-t használja (köztük én is), miközben fingjuk sincs a tényleges javascriptről. Ráadásul szvsz mostanra a Jquery erősen túl van hype-olva, a modern böngészőkben sok esetben csak minimálissal több munka natív js-ben megcsinálni ugyanazt, mint jquery-vel.
Szerintem az oktatásnak pont az a lényege, hogy az alapokat tanítsa meg. Olyan ez mintha úgy tanítanának programozni, hogy soha nem tanítják meg, hogy mi az a tömb, meg objektum, hanem nesze itt a spring mvc, aztán java-zunk.
Persze akkor lenne igazán szinvonalas az oktatás, ha a tisztán javscript-elés után, ugyanezt a példát megcsinálnák mondjuk jquery-vel, is hogy a tudás legyen naprakész is. De ez már a vágyálom kategória. -
Komolyan ajánlom, hogy felejts el Ie9 alatt minden böngészőt, és csináld CSS-el. Ha már arra vagy kíváncsi, hog ki mit ajánl
![;]](//cdn.rios.hu/dl/s/v1.gif)
Amúgy meg hajrá Szeged
Igen, arra hajlok, megcsinálom css-el. IE alatt gondoltam függőleges lesz, de még az a nyamvadt filter sem működik normálisan, vagy csak a kompatibilitási módban nem. Valami fallbacket fogok kitalálni, vagy lebeszélem őket erről, ugyanis elég rondán tud renderelni dőlt szöveget a firefox, meg a chrome is. IE9 és IE10 viszont gyönyörűen
-
google://jquery+rotate első találatok között ez elég szimpatikusnak tűnik. Gyakorlatilag megcsinálja helyetted azt a pár sor CSS-t, amit kézzel is megírhatnál
Úgy értettem a feltett kérdésem, hogy ki mit ajánlana, azaz ki mit használ. Rákeresni én is rátudtam
Mellesleg amit ajánlottál, az képekhez van. -
CSorBA
őstag
dzone-on volt fent ez a rendkívül hasznos script, hátha valakinek szüksége lesz hasonlóra egy projekt során:
http://theonion.github.io/fartscroll.js/
Ezt nem melóhelyen, bekapcsolt hangfalakkal kellett volna kipróbálnom...
-
CSorBA
őstag
Nézd meg a Fácsét IE8-ban például.
Ott pont úgy változik az URL, hogy hash-t használnak.Tehát valahogy így:
http://www.facebook.com/photo.php?fbid=1231231#!/photo.php?fbid=123123132&set=ASDADS&type=1&permPage=1A #!/photo.php?.... rész az érdekes.
Tehát van egy "fallback", ha nem támogatja ezt a feature-t a böngésző, amiről Athlon64+ beszélt.
Okok, tiszta sor
Nagyon komoly megoldás. -
CSorBA
őstag
Csak egy kicsit kellene tudni keresni. Ez egy HTML5 feature, ami nem működik minden böngészőben, információkat itt találhatsz, próbáld ki a window.history.replaceState-et!
Ezt ismerem, és ha jó isl tudom IE alatt nem megy. Az alatt meg nem néztem meg az FB-t, nem gondoltam h. ilyen feauturet raknak bele, ami nem minden browser alatt megy.
-
CSorBA
őstag
Udv!
van egy ilyen kodom amivel kulombozo fajlok tartalmat toltom be slide effect-el egy div-be:
$(function () {
function ajaxify(file){
$.get(file,function(data) {
$("#tartalom").hide('slide', {direction: 'left'}, 1000,function(){
$(this).html(data).show('slide', {direction: 'right'}, 1000,function(){
});
});
});
}
$('#nav li a').click(function(){
$('#nav li a.active').addClass('offline',1000)
$('#nav li a.active').removeClass('active',1000);
$(this).addClass('active');
$(this).removeClass('offline');
ajaxify($(this).attr('href'));
return false;
});
ajaxify('home.php');
});Ugy szeretnem atalakitani hogy a div tartalmanak valtozasaval egyutt valtozzon az url-is.
Ebbe tud nekem valaki segiteni?Elore is koszonom!
-
CSorBA
őstag
Eggyel visszább az ábécében
: CKEditor
Ezt tudom ajánlani, elég komolyan testreszabható, és folyamatosan fejlesztik. (Az külön jó pont, hogy Drupalhoz is nagyon jó modulja van, ezenkívül ASP.NET-es kontrollert is kínálnak hozzá, meg Java-alkalmazásokba is könnyen integrálható, plusz ingyenesen (persze van liszenszelt változata is).)Meglepődve látom, hogy az ábécében eggyel később lévő CLEditor pl. nem mutatja azt sem, ha egy szót már korábban mondjuk félkövérítettél: ha a kurzor a félkövérített szó valamelyik betűjénél áll, akkor nem kerül fókusz a félkövérítés ikonra... ahogy a többi formázást sem mutatja. Pedig ez alapvető elvárás lehet egy WYSIWYG-szerkesztővel szemben. (CKEditor alap, hogy tudja.)
Ja, de most, a hsz. megírásának végére látom, hogy azt írtad, hogy legyen "lebutított".
Hát, a CKEditor mondjuk nem kicsi, de végül is úgyis csak egyszer kell a böngészőnek betöltenie a hozzá tartozó JS-fájlt, utána a böngésző már cache-ből szedi.
De ha a fentebb linkelt demóoldalon a "Custom toolbar" linkre kattintasz, akkor láthatod, milyen a CKEditor "Basic" toolbarja:
Pont csak az alapvető eszközök láthatók rajta; ezt tetszőlegesen tudod bővíteni.
Bocsi srácok, kicsit késve reagálok
Megnéztem mindkettőt, köszi. De végül maradtam a tinymce-nél. Kicsit jobban beletúrtam, és eléggé lecsupaszítottam, valamint már használtam korábban is. Szóval ez jó lesz
. 
![;]](http://cdn.rios.hu/dl/s/v1.gif)
Új hozzászólás Aktív témák
- AMD K6-III, és minden ami RETRO - Oldschool tuning
- Xbox tulajok OFF topicja
- Elemlámpa, zseblámpa
- Konzol Screenshot
- Battlefield 6
- Nem kell még temetni: 2 éves órajelcsúcsot döntöttek meg Raptor Lake-kel
- Projektor topic
- Milyen videókártyát?
- Vicces képek
- Luck Dragon: Asszociációs játék. :)
- További aktív témák...
- 24 magos AMD Threadripper alapú munkára kiváló félgép, 128GB RAM-mal
- HP ZBook Fury 15 G7 i7-10850H 32GB 512GB SSD Quadro T2000 4GB FHD HUN bill, szép állapotban eladó
- Eladó MacBook Pro 16,1 2019 CTO
- új 0 km es garanciás lenovo loq rtx 5050 8gb
- Eladó teljesen újszerű karcmentes Samsung Galaxy Watch Ultra
- BESZÁMÍTÁS! Asus Prime X570 R7 5700 64GB DDR4 1TB SSD RTX 5060 Ti 16GB Zalman S2 TG FSP 650W
- OUTLET DELL PowerEdge R630 rack szerver - 2xE5-2680v4 (28c/56t, 2.4/3.3GHz), 192GB RAM, 4x1G, áfás
- AKCIÓ! EVGA FTW3 Ultra Gaming RTX 3080Ti 12GB videókártya garanciával hibátlan működéssel
- Bomba ár! HP EliteBook 8460P - i5-2GEN I 4GB I 250GB I 14" HD I DP I Cam I W10 I Garancia!
- iPhone SE 2020 64GB Black - 2 ÉV GARANCIA - Kártyafüggetlen, MS4902, 100% AKKSI
Állásajánlatok
Cég: Laptopműhely Bt.
Város: Budapest