Emojione区域不显示表情符号窗格

时间:2017-01-31 16:48:35

标签: javascript area emojione

我正在使用Emojione Area JavaScript插件。但是,我只显示文本区域,没有表情符号窗格。

这是我的HTML文件:

    <html>
    <head>
        <link rel="stylesheet" href="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.css">
        <script type="text/javascript" src="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.js"></script>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <link rel="stylesheet" href="stylesheet.css">
    </head>
    <body>
        <script>
            $(document).ready(function() {
                $("#emojionearea1").emojioneArea({
                    pickerPosition: "left",
                    tonesStyle: "bullet"
                });
        </script>

        <div class="row">
            <div class="span6">
                <textarea id="emojionearea1">Default :smile:</textarea>
            </div>
        </div>
    </body>
</html>

1 个答案:

答案 0 :(得分:1)

您的代码有两件事需要解决:

  1. 您需要在EmojioneArea
  2. 之前从jQuery导入Javascript文件
  3. 您在Javascript中的脚本没有关闭函数$(document).ready()
  4. 所以应该是:

    <html>
    <head>
        <link rel="stylesheet" href="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.css">
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.js"></script>
        <link rel="stylesheet" href="stylesheet.css">
    </head>
    <body>
    
    <div class="row">
        <div class="span6">
            <textarea id="emojionearea1">Default :smile:</textarea>
        </div>
    </div>
    
    <script>
        $(document).ready(function() {
            $("#emojionearea1").emojioneArea({
                pickerPosition: "left",
                tonesStyle: "bullet"
            });
        })
    </script>
    
    </body>
    </html>
    

    Popup将显示在右侧,因为Left不是propertyie pickerPosition的有效值。根据文档(www.github.com/mervick/emojionearea),唯一有效的值为toprightbottom。值top是默认值

    我希望它可以帮到你

    祝你好运