JSFiddle代码在超出JsFiddle环境时无法运行

Question

我为一个简单的反网络欺凌插件编写的代码在JSFiddle中运行得很好，但在我的网站上却没有运行，即使我添加了document.ready并使用了像jslint这样的c+p清洁剂。代码在JSFiddle上没有任何警告。我看过这个页面：(JSFiddle代码不能在我自己的页面中工作)，但这似乎不适用于我的问题。当代码在JSFiddle上运行时，为什么它不在其他环境中运行呢？

这是JSFiddle：“守则”

以下是我在我的网站上使用的确切的JS：

$(document).ready(function() {
  var triggerWords = ["stupid",
    "ugly",
    "fat",
    "kill",
    "dumb",
    "idiot",
    "freak",
  ];
  $(document).on('keyup', 'textarea', function humhm {
    for (var i = 0; i < triggerWords.length; i++) {
      if ($(this).val().toLowerCase().indexOf(triggerWords[i]) != -1) {

        document.getElementById("styled").className = "mystyle";
        document.getElementById("shover").className = "mason";
        const messages = ['<img src="https://lh3.googleusercontent.com/TzOBj6xt9unc8n41fMyUZ46FG4MRXBK6wkdOtzmKJPoLa9gBYNwZYQkRB8fsboqM1LHh3ahxOLOlyKsH1zG1qmGHgbS6IK-yZtv6Duo6_thwIKEVRY7BZNr2JJzAkYviyKp_q7SPWnp1"width="200px" class="floater" onclick="javascript:eraseText();">Words mean a lot. Their echoes can brighten someone\'s day. Or they can make a bad day worse. Consider the person behind the screen.', '<img src="https://lh3.googleusercontent.com/TzOBj6xt9unc8n41fMyUZ46FG4MRXBK6wkdOtzmKJPoLa9gBYNwZYQkRB8fsboqM1LHh3ahxOLOlyKsH1zG1qmGHgbS6IK-yZtv6Duo6_thwIKEVRY7BZNr2JJzAkYviyKp_q7SPWnp1"width="200px" class="floater" onclick="javascript:eraseText();">Your words can be a force for happiness or dejection. Choose carefully.', 'Be mindful of your words. Would you say this in real life?', 'Consider the impact your words may have. A couple insults slung casually can be much more significant to others.', 'Words that are insignificant to you can deeply hurt another. Be empathetic. Be nice.'];
        const randomIndex = Math.round(Math.random(messages.length * 10 - 0.5));
        document.getElementById("shover").innerHTML = messages[randomIndex];
        document.getElementById("usual").className = "noshow";
        document.getElementById("trigger").className = "norm";
      }
    }
  });


});
'

Answer 1

你是在进口JQuery吗？常见的“罕见”错误来自简单的问题。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我建议您利用JQuery来提高代码的可读性，您可以将所有document.getElementById("ID_VALUE")替换为$('#ID_VALUE')

祝你在反网络抢注方面好运。重要的事。

Answer 2

您需要导入jQuery。

JSFiddle确实会导入它。

​