Autor | Zpráva | ||
---|---|---|---|
Anonymouz Profil * |
#1 · Zasláno: 20. 6. 2018, 17:13:01
Mám vytvořený kód, který mi propisuje text z jednoho sloupce do formuláře. Nyní bych potřeboval pomoct, jak udělat, aby tento kód platil i pro ostatní tlačítka s tím, že sloupce mohou v budoucnu i přibývat. Chci se vyhnout prasárně - celý kód několikrát nakopírovat, očíslovat co je třeba a dělat to přes nth-child query selectory. Takové řešení sice taky funguje, ale není to dobře a rád bych zjistil řešení, jak se to má dělat pořádně.
Vytvořil jsem demo kódu codepen.io/anon/pen/mKxbgp Předem děkuji za rady. |
||
RastyAmateur Profil |
#2 · Zasláno: 21. 6. 2018, 00:05:28
Anonymouz:
Řešil bych to přes rodiče a děti (viz ukázka (použito jQuery)). Bude to fungovat i na 50 sloupců. Pokud by přibývaly i ty odstavce a inputy ve formuláři, půjde použít nějaký jednoduchý cyklus. |
||
Anonymouz Profil * |
#3 · Zasláno: 21. 6. 2018, 10:07:43
Původně jsem to tvoje řešení zkoušel napsat bez jQuery, ale to mi nefungovalo. Zasílám odkaz pro pobavení Živá ukázka.
No ale nechal jsem tedy jQuery a pouze to přepsal, aby to fungovalo pro mé účely (selectory atd.) a funguje to. |
||
RastyAmateur Profil |
#4 · Zasláno: 21. 6. 2018, 10:14:36
Anonymouz:
Také mám problém s čistým JS. Každopádně občas pomůže stránka youmightnotneedjquery.com |
||
Radek9 Profil |
#5 · Zasláno: 21. 6. 2018, 10:15:30
Anonymouz:
Bez jQuery třeba takhle: Živá ukázka Důležité je si uvědomit, že jQuery ve většině případů pracuje rovnou s kolekcemi. Takže metoda on navěsí handler na všechny elementy v kolekci. To se v běžném DOMu musí dělat trochu jinak. Buď výběrem kolekce a cyklem (jako v ukázce), nebo navěšením handledru na rodičovský element.
|
||
Anonymouz Profil * |
#6 · Zasláno: 21. 6. 2018, 16:02:07
Díky moc za ukázku, jak to vypadá v čistém JS. Dost jsem se díky obojímu naučil, co jsem neznal.
Obě řešení teď tedy dovedou udělat totéž a tak si trochu kladu otázku, které z nich je lepší. Selským rozumem to beru tak, že abych mohl využít jQuery na podobnou kravinku, tak kvůli tomu musím stahovat zbytečně celou knihovnu, která obsahuje spoustu dalších věcí, které třeba nepotřebuji. Dívám se na to správně, že je to tedy tak, že řešení pomocí jQuery bude o něco náročnější a pomalejší pro prohlížeč, než čistý JS? V tomto případě je to asi jedno, spíš se ptám, abych do budoucna věděl, zda rovnou sahat po jQuery, nebo se nejprve snažit najít řešení přes čisté JS. |
||
RastyAmateur Profil |
#7 · Zasláno: 21. 6. 2018, 16:26:31
Anonymouz:
Dle mého názoru je to čisté JS lepší řešení. Přesně kvůli tomu, co jsi psal - zbytečně stahuješ celou knihovnu kvůli jedné funkci... Já jsem se od Radka také přiučil. Když jsem se snažil udělat řešení také v čistém JS, neznal jsem funkci querySelectorAll() , kvůli které mi to nešlo... :-)
|
||
Anonymouz Profil * |
Ještě jsem se zamotal do jiné věci. Radkovo řešení mi funguje dobře. dokud používám
this.parrent() Ještě jsem se zamotal do jiné věci. Radkovo řešení mi funguje dobře. dokud používám this.parrentNode() , jenže já potřebuju this.closest() , protože se potřebuji dostat ještě vejš než jen do rodiče toho klikacího elementu. A když this.closest() použiju, tak to celé dunguje pouze při prvním kliknutí - potom je třeba refresh, neboť to háže chybu, že classList je prázdný. Na první kliknutí funguje vše dobře, na druhé už ne.
To musím v obyčejném JS nějak resetovat, aby to vědělo, kde se nacházet? Nevím zda to popisuju dobře, raději dávám ukázku. Živá ukázka |
||
RastyAmateur Profil |
#9 · Zasláno: 22. 6. 2018, 02:04:36
Anonymouz:
var odebrat = document.querySelector(".vc_row.neviditelnost"); odebrat.classList.remove("neviditelnost"); .vc_row.neviditelnost a pak tu třídu .neviditelnost odebereš, tudíž když se pak zase snažíš najít .vc_row.neviditelnost , element již neexistuje
|
||
Anonymouz Profil * |
#10 · Zasláno: 22. 6. 2018, 13:44:21
Jo tak to mi vůbec nedošlo, že může být problém v tomhle. U jQuery to takhle prošlo, takže jsem to tak nechal. Po přepsání už to funguje. Člověk se pořád učí. Díky moc :)
|
||
Časová prodleva: 3 měsíce
|
|||
Anonymouz Profil * |
Znovu bojuju s opakováním stejné funkce pro více elementů. Chci pomocí JS odebrat u cen lomítka, pokud neobsahují žádný text za tím. Když použiju normální JS, tak nefunguje
querySelectorAll a s normálním selectorem to funuje pouze jednou. Když to zkusím pomocí jQuery, tak to zase funguje uplně všude i tehdy, když by to nemělo fungovat. Ani v jednom případě se mi nepodařilo umístit .this , abych označil, že to má fungovat pouze pro daný selector, který splňuje podmínku.Edit: ukázka kódu Živá ukázka Edit: ukázka kódu: Živá ukázka |
||
RastyAmateur Profil |
#12 · Zasláno: 17. 9. 2018, 17:25:01
Anonymouz:
Živá ukázka Máš možnost toto ovlivnit již při výpisu? Myslím si, že by bylo lepší to řešit již na backendu aplikace |
||
Keeehi Profil |
#13 · Zasláno: 17. 9. 2018, 17:58:30
Anonymouz:
S jQuery je správný zápis tento. Živá ukázka A jak píše RastyAmateur, pokud máš tu možnost tak by bylo lepší ty lomítka ze serveru neposílat. Je to čistší řešení. |
||
Časová prodleva: 9 dní
|
|||
Anonymouz Profil * |
Mám další problém.
V redakčním systému je použita šablona, kde se poslední články dané rubriky vypisují tak, že na detail článku se člověk dostane pouze přes titulek. Potřebuji tam doplnit tlačtko "číst více" které bude mít stejný odkaz jako titulek. Myslel jsem si, že to bude snadné doplnit pomocí JS a bylo by, pokud bych to tak chtěl pouze jednou. Jakmile je na stránce více daných prvků, tak se mi nedaří vytáhnout URL z daného titulku. Přestože používám $(this) , tak mi to vyzobává pouze href z prvního titulku.
Díky za každou radu. Edit: zapomněl jsem dodat ukázku Živá ukázka |
||
Keeehi Profil |
#15 · Zasláno: 26. 9. 2018, 13:47:02
Živá ukázka
Ale bylo by mnohem lepší, kdyby to generovala rovnou ta šablona. |
||
Anonymouz Profil * |
#16 · Zasláno: 26. 9. 2018, 14:25:20
Moc děkuji, zkoušel jsem to i takhle, ale místo find() jsem dával closest(), takže proto mi to nefungovalo. Do šablony moc nechci hrabat, abych nekomplikoval případné aktualizace. Zkoušel jsem to přes child šablony, ale bohužel mi child příliš nafunguje u šablon, které využívají nějaký framework.
A bohužel neovládám PHP, abych to mohl obejít nějakým externím scriptem na straně serveru. Ani nevím, zda to php dovede tak jednoduše, jak si to představuji. |
||
Časová prodleva: 1 rok
|
|||
Anonymouz Profil |
#17 · Zasláno: 4. 2. 2020, 12:28:29
Chci si vytvořit něco jako posuvník na porovnávání obrázků ve vanilla JS a mám problém s případným použitím stejného prvku, protože se mi evenet listener aplikuje na všechny třídy.
Myslel jsem si, že opakování stejné funkce už chápu, ale zřejmě ne dostatečně. Přidávám ukázky. Živá ukázka tady se to aplikuje úplně na vše. Živá ukázka a tady se mi pro změnu aplikuje pouze na ten první. Díky za každou radu. |
||
Časová prodleva: 4 roky
|
0