不能使用wysihtml,未定义的错误

时间:2017-04-24 05:32:26

标签: javascript

到目前为止我使用的是最新版本(安装了凉亭,但重新定位了文件),然后我已经设置了所有内容。

顺便说一句,我也在为我的"创建帖子"

使用jQuery + Bootstrap +模态

当一切都已经完成设置时,当我看到我的textarea它就像一个正常的那个,然后我看到我的控制台日志并且它说:

  

未捕获的ReferenceError:未定义wysihtml

但是,我的控制台日志中没有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>

1 个答案:

答案 0 :(得分: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>