2016-05-23 2 views
0

Ich habe ein Skript, das hilft, ein Bild zu kommentieren. Ich möchte dieses Skript nur ausführen, wenn ich auf die Schaltfläche klicke. Ich habe versucht, das Ereignis onclick für die Schaltfläche zu verwenden, aber es funktioniert nicht. Hier ist der CodeRufen Sie ein Skript auf, wenn Sie auf klicken

<head> 
    <script src="javascripts/jquery.js"></script> 
    <script src="javascripts/jquery-ui.min.js"></script> 
    <link rel="stylesheet" href="stylesheets/jquery-ui.css"> 

    ////////////// those are the scripts that i use in the function ////// 
    <link rel="stylesheet" href="highlight.js/zenburn.css"> 
    <link rel="stylesheet" href="stylesheets/css/theme-dark/annotorious-dark.css" /> 
    <script src="highlight.js/highlight.pack.js"></script> 
    <script src="javascripts/annotorious.min.js"></script> 
    ///////////// 
    <script> 
    $("#annotation").click(function() { 
     hljs.initHighlightingOnLoad(); 
     //function of annotation 
    }); 
    </script> 
</head> 
<body> 
<button type="submit" id="annotation" > 
    <img src="stylo.png" style="width: 30px ; height:50px" alt="Submit"> 
</button> 
</body> 

Aber das funktioniert nicht, ich habe immer noch das Skript ausgeführt wird, wenn ich die Seite zu laden. Ich muss es nur aufrufen, wenn der Button "Annotation" angeklickt wird.

+1

_ "Aber das funktioniert nicht" _? Was ist das ? Irgendein Fehler in 'Konsole'? – Rayon

+0

Haben Sie einen Fehler in der Konsole? – AxelH

+0

Nein, es gibt keine Fehler. Wie ich schon sagte, ich möchte das Skript nur ausführen, wenn auf die Schaltfläche geklickt wird. Aber mit dem Versuch, den ich gemacht habe, funktioniert es nicht, weil das Skript direkt nach dem Laden der Seite ausgeführt wird, ohne auf die Schaltfläche zu klicken. – yassine

Antwort

1

Hier gehen Sie

<script> 
    $(document).ready(function(){ 
     $("#annotation").click(function() 
      { 
      alert("Hello!"); 
      // hljs.initHighlightingOnLoad(); //function of annotation 
      }); 
    }); 
    </script> 

    <button type="submit" id="annotation" > <img src="stylo.png" style="width: 30px ; height:50px" alt="Submit"></button> 

Ich weiß nicht, über Ihre hljs.initHighlightingOnLoad(); Funktion, aber soweit die Ausführung der Funktion auf Knopf klicken, müssen Sie diesen Code in $ (Dokument) .ready() - Funktion schreiben. Es funktioniert gut, da ich bereits mit einem alert() getestet habe;


--------------------------- AKTUALISIERT ------------- -------------------

ich es habe durch die Verwendung von CDN jquery und highlightjs getestet

<head> 
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 

    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/highlight.min.js"></script> 

    <script> 
     $(document).ready(function(){ 
     $("#annotation").click(function() 
      { 
       hljs.initHighlightingOnLoad(); //function of annotation 
      }); 
     }); 
    </script> 
</head> 
<body> 

    <button type="submit" id="annotation" > 
     <img src="stylo.png" style="width: 30px ; height:50px" alt="Submit"> 
    </button> 
    </body> 
+0

ich habe es auch mit der Warnung getestet, es funktioniert. wie ich schon sagte der Button funktioniert gut mit der Warnung, aber wenn ich das Skript aufrufen will funktioniert es nicht – yassine

+0

Yassine ich verstehe eigentlich nicht, dass hljs.initHighlightingOnLoad(); .. Es wäre klarer, wenn Sie diese Funktionsdefinition oder die Bibliothek geben könnten, von der diese Funktion aufgerufen werden soll –

+0

Ich habe gerade nach dieser Funktion gesucht ... Hier ist, was ich gefunden habe. 'hljs.initHighlighting.called = false; hljs.initHighlighting(); ' –