Question

您好StackOverflow社区

我做错了但却无法弄清楚它是什么。我遇到了一些Java脚本问题，似乎Django不想要它。我试图将以下Java脚本添加到我的站点，但代码只是不想坚持。这是一个有效的示例，但我无法在code下面的代码中复制它。

javascript应该采用一些标签，例如：lol：并自动将其转换为可编辑p标签内的表情符号。它也应该改变：somegif：到动画gif（请通过上面的链接查看代码以获得可行的示例）。我做错了什么？

这是我的HTML：

(function () {
    var $input, emojiMap;
    emojiMap = {
        ':lol:': '&#x1F606;',
        ':somegif:': '<img src="http://i.giphy.com/pPzjpxJXa0pna.gif" />'
    };
    $input = $('.input');
    $input.on('keyup input', function (ev) {
        var code, range, replacement, selection, text;
        text = $input.html();
        for (code in emojiMap) {
            if (window.CP.shouldStopExecution(1)) {
                break;
            }
            replacement = emojiMap[code];
            text = text.replace(code, replacement);
        }
        window.CP.exitedLoop(1);
        $input.html(text);
        range = document.createRange();
        selection = window.getSelection();
        range.setStart(this, this.childNodes.length);
        range.collapse(true);
        selection.removeAllRanges();
        return selection.addRange(range);
    });
}.call(this));

input,
.input {
  border: 1px solid #ccc;
  display: block;
  font-family: sans-serif;
  font-size: 1em;
  padding: .5em;
  width: 50vh;
  background-color: white;
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    {% load static from staticfiles %}
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap core CSS -->
    <link href="{% static 'css/bootstrap.css' %}" rel="stylesheet">

    <!-- Custom Styles CSS -->
    <link href="{% static 'css/styles.css' %}" rel="stylesheet">

    <!-- jQuery Implementation-->
    <script src="{% static 'js/jquery-1.12.2.min.js'%}"></script>
    <script src="{% static 'js/rango-jquery.js' %}"></script>
    <script src="{% static 'js/bootstrap.min.js' %}"></script>
  </head>
  <body id="body_color">
    <div class="container" id="top_container">
        <div class="row"> <!-- Major Row containing both the chat window and the autoring window -->
            <div class="col-lg-4 center-block">
                <h1>{{secretDisplay.secretTitle}}</h1>
                    <div class="row">
                        <div class="col-ls-12"> 
                            <p contenteditable="true" class="center-block input"></p>
                        </div>
                    </div>
            </div>
         </div>
    </div>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
  </body>

Answer 1

确定。所以我通过回顾这个问题的答案来找出答案： Strange JavaScript behavior in CodePen with humongous arrays

问题是两段代码，Code Pen注入循环。

if (window.CP.shouldStopExecution(1)) {
            break;
}

这一个：

window.CP.exitedLoop(1);

一旦我拿出这些就行了。

Django和Java Script问题 - 我做错了什么？

1 个答案: