Clipoboard.jsはコピーじゃない - noobの

を私はこの続き：私は私が持っているClipoboard.jsはコピーじゃない - noobの

"{{ url_for('static', filename='js/clipboard.min.js') }}"

に問題を持っていない

<!DOCTYPE html> 
    <html lang="en"> 
     <head> 
    [...]  
    <script type="text/javascript" src="{{ url_for('static', filename='js/clipboard.min.js') }}"></script> 
     <script> 
      new Clipboard('.btn'); 
     </script> 

    <body> 



    <!-- Target --> 
    <div id="bar">Mussum ipsum cacilds...</div> 

    <!-- Trigger --> 
    <button class="btn" data-clipboard-action="copy" data-clipboard-target="#bar"> 
    Copy to clipboard 
</button> 



     </body> 
    </html>

：これは私のhtmlファイルであるhttps://jsfiddle.net/gevorgha/fbeof421/

をブラウザのコンソールでこのエラーが発生しました：

clipboard.min.js:7 Uncaught TypeError: Cannot read property 'addEventListener' of null 
    at o (clipboard.min.js:7) 
    at c (clipboard.min.js:7) 
    at o (clipboard.min.js:7) 
    at e.t [as listenClick] (clipboard.min.js:7) 
    at new e (clipboard.min.js:7) 
    at (index):13 
o @ clipboard.min.js:7 
c @ clipboard.min.js:7 
o @ clipboard.min.js:7 
t @ clipboard.min.js:7 
e @ clipboard.min.js:7 
(anonymous) @ (index):13

jsfiddleの例は、私のものではなく動作します。あなたは何か考えていますか？

出典

2017-08-27 4m1nh4j1

デバッグに役立つように、dev環境で未使用のjavascriptファイルを使用するのは良い習慣です。 – Jarzon

JavaScriptは、ボタンを呼び出す前に既にボタンが作成されている必要があります。 HeadはHTMLコードの最初の部分であるため、まだ作成されていないボタンを呼び出そうとします。

スクリプトを配置する本体の下部にあるボタンを呼び出すと、スクリプトが呼び出す前にボタンが作成されていることが確認されます。

出典

2017-08-27 20:34:41

Clipoboard.jsはコピーじゃない - noobの

答えて

関連する問題