2016-12-12 4 views
0

Quill Quickstart guideに続いて、私はクイルテキストエディタを使用しようとしています。クイルテキストエディタが機能しない

以下はコードです。

<html> 
    <head> 
    <title></title> 
    <link href="https://cdn.quilljs.com/1.1.6/quill.snow.css" rel="stylesheet"> 
    <script src="Scripts/jquery-3.1.1.min.js"></script> 
    <script src="Scripts/jquery-3.1.1.js"></script> 
    <script src="https://cdn.quilljs.com/1.1.6/quill.js"></script> 

    <!-- Initialize Quill editor --> 
    <script> 
     var quill = new Quill('#editor', { 
     theme: 'snow' 
     }); 
    </script> 

    <style> 
     #editor-container { 
     height: 375px; 
     } 
    </style> 
    </head> 

    <body> 
    <!-- Create the editor container --> 
    <div id="editor"> 
     <p>Hello World!</p> 
     <p>Some initial <strong>bold</strong> text</p> 
     <p><br></p> 
    </div> 
    </body> 
</html> 

しかし、予想される出力が得られません。私が得ている出力は次のとおりです。

こんにちは!

いくつかの初期太字テキスト

私は何をしないのですか?

ありがとうございました。

答えて

3

例から起動してみてください。

次回に問題が発生したときに投稿する前に、デベロッパーコンソールを確認することをお勧めします。それは貴重な助けです。

<html> 
<head> 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
    <link href="https://cdn.quilljs.com/1.1.6/quill.snow.css" rel="stylesheet"> 
    <script src="https://cdn.quilljs.com/1.1.6/quill.js"></script> 
    <style> 
    #editor-container { 
    height: 375px; 
    } 
    </style> 
</head> 
<body> 

    <!-- Create the editor container --> 
    <div id="editor"> 
    <p>Hello World!</p> 
    <p>Some initial <strong>bold</strong> text</p> 
    <p><br></p> 
    </div> 

    <!-- Initialize Quill editor --> 
    <script> 
    var quill = new Quill('#editor', { 
     theme: 'snow' 
    }); 
    </script> 

</body> 
</html> 
+0

はい。それは私のために働いた。私はこれについて別の質問があります - 画像リンクを使用して、どのように画像をデータベースに保存しますか? –

+0

クールツールバーの「イメージ」をクリックすると同時にいくつかのアクションを実行する方法を尋ねていますか?そのイベントのカスタムハンドラを作成します。 http://quilljs.com/docs/modules/toolbar/ – nik10110

0

あなたはQuillのスクリプトを何度も含むように見えます。

あなたは、コンテナ(<div id="editor">)を作成した後は、クイルエディタを初期化する必要がquickstart guide...

<!-- Include stylesheet --> 
<link href="https://cdn.quilljs.com/1.1.6/quill.snow.css" rel="stylesheet"> 

<!-- Create the editor container --> 
<div id="editor"> 
    <p>Hello World!</p> 
    <p>Some initial <strong>bold</strong> text</p> 
    <p><br></p> 
</div> 

<!-- Include the Quill library --> 
<script src="https://cdn.quilljs.com/1.1.6/quill.js"></script> 

<!-- Initialize Quill editor --> 
<script> 
    var quill = new Quill('#editor', { 
    theme: 'snow' 
    }); 
</script> 
+0

重複を削除しようとしましたが、問題のコードを更新しました。依然として出力は変化しません。 –

+0

javascriptコンソールにエラーが表示されますか? –