2017-04-24 6 views
0

私はこれまでのバージョン(bowerと一緒にインストールされていましたが、ファイルを再配置しました)を使用しています。ところでwysihtmlを使用できません。未定義のエラー

、私はまた、すべてのものがすでに設定が完了したとき、私の、私は私のtextareaを見ると、それは普通のもののようで、

を「ポストを作成する」ためのjQuery +ブートストラップ+モダールを使用しているにコンソールログが表示され、以下のように表示されます。

Uncaught ReferenceError: wysihtml is not defined

ただし、コンソールログに404エラーはありません。

私のコードの抜粋:

<!DOCTYPE html> 
<html> 
<head> 
    <!-- Bootstrap Core CSS --> 
    <link href="../../../assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> 
</head> 
<body> 
<div class="modal fade" id="addPage" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <form> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="myModalLabel">Add Page</h4> 
      </div> 
      <div class="modal-body"> 
      <div class="form-group"> 
       <label>Page Title</label> 
       <input type="text" class="form-control" placeholder="Page Title"> 
      </div> 
      <div class="form-group"> 
       <label>Page Thumbnail Image:</label> 
       <input type="file" name="headerimage" style="display: inline" required accept="image/*"> 
      </div> 
      <div class="form-group"> 
       <label>Page Header Image:</label> 
       <input type="file" name="thumbnail" style="display: inline" required accept="image/*"> 
      </div> 
      <div class="form-group"> 
       <label>Page Content</label> 
       <div id="wysihtml-toolbar" style="display: none;"> 
        <a data-wysihtml-command="bold">bold</a> 
        <a data-wysihtml-command="italic">italic</a> 

        <!-- Some wysihtml5 commands require extra parameters --> 
        <a data-wysihtml-command="foreColor" data-wysihtml-command-value="red">red</a> 
        <a data-wysihtml-command="foreColor" data-wysihtml-command-value="green">green</a> 
        <a data-wysihtml-command="foreColor" data-wysihtml-command-value="blue">blue</a> 

        <!-- Some wysihtml5 commands like 'createLink' require extra paramaters specified by the user (eg. href) --> 
        <a data-wysihtml-command="createLink">insert link</a> 
        <div data-wysihtml-dialog="createLink" style="display: none;"> 
        <label> 
         Link: 
         <input data-wysihtml-dialog-field="href" value="http://" class="text"> 
        </label> 
        <a data-wysihtml-dialog-action="save">OK</a> <a data-wysihtml-dialog-action="cancel">Cancel</a> 
        </div> 
       </div> 
       <textarea id="wysihtml-textarea" placeholder="Page Body"></textarea> 
      </div> 
      <div class="form-group"> 
       <label>Meta Description</label> 
       <input type="text" class="form-control" placeholder="Add Meta Description..."> 
      </div> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      <button type="submit" class="btn btn-primary">Save changes</button> 
      </div> 
     </form> 
     </div> 
     </div> 
    </div> 
<!-- jQuery --> 
    <script src='../../../assets/vendor/jquery/jquery.min.js'></script> 

    <!-- BootstrapJS --> 
    <script src='../../../assets/vendor/bootstrap/js/bootstrap.min.js'></script> 

    <!-- InlineTextEditor --> 
    <script src="../../../assets/wysihtml/dist/wysihtml.js"></script> 
    <script src="../../../assets/wysihtml/dist/wysihtml-toolbar.min.js"></script> 
    <script src="../../../assets/wysihtml/parser_rules/advanced.js"></script> 
    <script> 
     var editor = new wysihtml.Editor("wysihtml-textarea", { // id of textarea element 
      toolbar:  "wysihtml-toolbar", // id of toolbar element 
      parserRules: wysihtml5ParserRules // defined in parser rules set 
     }); 
    </script> 
</body> 
</html> 
+0

私はjQueryの前にwysihtmlを配置しようとしましたが動作しません。彼らのgithub repo:[リンク](https://github.com/Voog/wysihtml/) – Axis

答えて

0

あなたは試したことがありますか?

 <script> 
     $(function() { 
     var editor = new wysihtml.Editor("wysihtml-textarea", { // id of textarea element 
       toolbar:  "wysihtml-toolbar", // id of toolbar element 
       parserRules: wysihtml5ParserRules // defined in parser rules set 
      }); 
    }); 
    </script> 
+0

私はjavascriptの下にwysihtmlに関連したjavascriptファイルを入れて、あなたのコードをコピーしてコピーしようとしました。現在いくつかのエラーがあります。 '(index):221 Uncaught ReferenceError:wysihtmlがHTMLDocumentの で定義されていません。 (jquery.min.js:2)((index):221) i(jquery.min.js:2) at Object.fireWith [as resolveWith](jquery.min.js:2) at Function.ready 2) at HTMLDocument.K(jquery.min.js:2) ' – Axis

+0

... wysihtml ...ファイルが正しく読み込まれていますか? – s1mpl3

+0

私はそう思います、これまでのところエラーはありません。私がそれを見て、wysihtmlファイルをクリックすると、それは問題ありません。 – Axis

関連する問題