NEJVÝHODNĚJŠÍ AKCE ROKU: 90 % extra kreditů ZDARMA s promokódem STROMECEK90. Zjisti více:
NOVINKA: Staň se datovým analytikem od 0 Kč a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:

Diskuze – Lekce 3 - Nahrazování obsahu & klonování v jQuery (DOM)

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře
Nejnovější komentáře jsou na konci poslední stránky.
Avatar
Jirka
Člen
Avatar
Odpovídá na Honza Bittner
Jirka:4.5.2014 17:58

Ano, to máte pravdu, ale v tom dílu konkrétně 5. bylo:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

A s tímto jquery ty vaše javascripty nefungovaly. Já jen, aby případným nováčkům jako já to pak nezamotalo hlavu, mořil jsem se s tím a hledal jsem kde je chyba :) Samozřejmě možná je to jinak a jen jsem hloupý já, kdo ví :)

Avatar
jos.pekar
Člen
Avatar
jos.pekar:13.9.2014 19:27

Ahoj. Ten script s kliknutím mi též nefungoval. Poupravil jsem kód do následující podoby a vše funguje:
$('div').clic­k(function(){
var obsah = $(this).html();
$(this).repla­ceWith('<p>' + obsah + '</p>');
});

Avatar
Bebbana
Člen
Avatar
Bebbana:27.4.2016 13:15

Já to upravila takhle:

$(function(){
    $('p').each(function(){
       var obsah = $(this).html();
       $(this).replaceWith('<div>' + obsah + '</div>');
       $('div').click(function(){
           $(this).replaceWith('<p>' + obsah + '</p>');
       });
});
Editováno
Avatar
Bebbana
Člen
Avatar
Odpovídá na Bebbana
Bebbana:27.4.2016 13:28

Oprava, takhle:

$(function(){
    $('p').each(function(){
       var obsah = $(this).html();
       $(this).replaceWith('<div>' + obsah + '</div>');
       $('div').click(function(){
           $(this).replaceWith('<p>' + obsah + '</p>');
       });
    });
});
Avatar
David Hanč
Člen
Avatar
David Hanč:4.11.2016 20:30

Dobří lidé, poraďtě co s tím je špatně? Asi to bude uplně něco triviálního, ale uniká mi to.

<!DOCTYPE html>
<html lang="cs-cz">
<head>
<meta charset="UTF-8" />

<meta name="description" content="DOM manipulace v jQuery" />
<title></title>

<script src="http://a­jax.googleapis­.com/ajax/lib­s/jquery/1.10­.2/jquery.min­.js"></script>

<script src="js1.js"></scrip­t>

<link rel="stylesheet" href="css.css" type="text/css"/>
</head>
<body>
<p> Chci </p>
<p> Pozdravit </p>
<p> Penny </p>

<p class="last">! </p>

</body>
</html>

javascript:

$('div').on('clic­k', function(){
var obsah = $(this).html();
$(this).repla­ceWith('<p>' + obsah + '</p>');
});

Avatar
Štefan Pružinský
Tvůrce
Avatar
Odpovídá na David Hanč
Štefan Pružinský:4.11.2016 21:15

Pokúšaš sa pracovať s neexistujúcim div-om. Najprv je potrebné výtvoriť div, a až následne je s ním možné pracovať. :)
Taktiež Ti odporúčam načítavať JavaScript až na konci súboru. Dôvodom je správna funkcionalita DOM. Veľa zdaru! :)

Odpovědět
Najefektívnejším spôsobom debuggingu je modlitba. :)
Avatar
David Hanč
Člen
Avatar
Odpovídá na Štefan Pružinský
David Hanč:7.11.2016 21:48

Děkuji

Avatar
arnost99
Člen
Avatar
arnost99:30.10.2017 4:54

Možná bych ještě zmínil (když už bylo zmíněno :first a :last) využitelnost ":even" a ":odd", které vyberou pouze sudé a liché selektory...

Editováno
Avatar
Karel Labonek
Člen
Avatar
Karel Labonek:19.4.2018 7:56

Ahojki, rád bych v ukázce č.3 docílil toho že po kliknutí se "p" přepíše na "div" a po dalším kliknutí zase "div" na "p" a takto pořád dokola, něco mi zřejmě uniká :-( . Má někdo nějaký nápad :-) . Děkuji

Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Karel Labonek
Honza Bittner:19.4.2018 18:25

No, tady to budeš muset udělat jinak, jelikož všechny tyto eventy, které se píšou v kódu, se zaregistrují jen pro ty elementy, které již jsou v DOMu. Pokud do DOM přidáš nějaký další element, tyto eventy již nebude mít zaregistrovány.

Dá se to udělat různými způsoby, jeden z jednodušších je například zaregistrovat event na dokument, který bude event jakoby předávat dál. To uděláš nějak takto:

$(document).on("click","p",function() {
  var obsah = $(this).html();
  $(this).replaceWith('<div>' + obsah + '</div>');
});

$(document).on("click","div",function() {
  var obsah = $(this).html();
  $(this).replaceWith('<p>' + obsah + '</p>');
});
Odpovědět
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Nejnovější komentáře jsou na konci poslední stránky.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 24.