Diskuze: Nefunguje unobtrusive volání funkce

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Honza

Člen

Honza:5.1.2017 15:16

Ahoj, konečně jsem se dokopal abych se začal učit javascript (konkrétně jQuery), ale zasekl jsem se hned na začátku. Udělal jsem si funkci v samostatném souboru která má po stisknutí tlačítka zobrazit alert. Pokud funkci navážu přímo v html na onclick tak je vše ok. Pokud se ale pokusím o unobtrusive přístup, tak se nestane nic (nefunguje mi to ani na kalkulačce, kterou jsem stáhnul z tutoriálu na tomto webu). Pro úplnost uvádím že to píšu v Javě (spring, maven) a používám Eclipse.

Toto mi funguje:

index.html:

<!DOCTYPE html>
<html lang="cs-cz">

        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"/>
                        <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
                <script src="js/alert.js"></script>
        </head>

        <body>
                <button onclick="clickfunction();">Hmm</button>
        </body>

</html>

alert.js:

function clickfunction() {
        alert('Hmm koblížek');
};

Toto nefunguje i když by asi mělo:

index.html:

<!DOCTYPE html>
<html lang="cs-cz">

        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"/>
                        <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
                <script src="js/alert.js"></script>
        </head>

        <body>
                <button id="button1">Hmm</button>
        </body>

</html>

alert.js:

$('#button1').click(function(){
        alert('Hmm koblížek');
});

nebo:

var clickfunction = function() {
        alert('Hmm koblížek');
};

$('#button1').click(clickfunction);

Netuším co dělám špatně, ale u znaku $ se mi zobrazuje warning "Function $ undefined" což mi taky příjde trošku divný...
Předem děkuji za jakékoli postrčení.

Editováno 5.1.2017 15:18

Odpovědět

5.1.2017 15:16

Snadnou cestou se daleko nedostanete, je tam velká tlačenice...

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:5.1.2017 15:35

Ahoj,
musíš si uvědomit, že takto vložený .js kód se spouští ihned, tedy ještě dřív, než se vytvoří samotné tlačítko v DOM a mohl bys jemu přiřadit nějakou akci. Doporučuji ti tvůj javascriptový kód vložit do následujícího bloku, který ho spustí, až bude načtená celá stránka. Je to běžná věc.

$(function(){

  // Po úplném načtení stránky se spustí tento kód.
    $('#button1').click(function(){
      alert('Hmm koblížek');
    });

});

Další možností je vložit řádek s <script> až někde na konec html souboru, ale to se spíš dělá kvůli rychlejšímu načítání samotné stránky.

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

5.1.2017 15:35

Neaktivní uživatelský účet

Honza

Člen

Honza:6.1.2017 8:08

Super, to byla ta chybějící informace, teď už to funguje Děkuju

Nahoru Odpovědět

6.1.2017 8:08

Snadnou cestou se daleko nedostanete, je tam velká tlačenice...

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 3 zpráv z 3.

Nejčastěji vyhledáváné

Diskuze: Nefunguje unobtrusive volání funkce