添加输入

Question

我的代码有很大的问题。一切都按我想要的方式工作，但是当我添加一个触发jQuery代码的输入时，一切都中断了（当页面加载不应该并且代码不起作用时页面加载），我找不到解决方案，我什至没有知道是什么原因，因为控制台没有返回任何错误。 输入如下：

<INPUT TYPE="text" id="headline1" maxlength="30" style="width: 350px;float:left;min-height: 32px;">
<span id="countHeadline1" class="adCounter" style="color: rgb(255, 255, 255);float:left;position: inherit;margin-left: 0px;">0</span>

这是触发的jQuery：

document.addEventListener("DOMContentLoaded", function(event) {

  $('#headline1').keyup(updateCount);
  jQuery('#headline1').keydown(updateCount);

  function updateCount() {
    var cs = [jQuery(this).val().length];
    jQuery('#countHeadline1').text(cs);
    var cs = [jQuery(this).val()];
    jQuery('#headlineText').text(cs);
  }

  console.log("DOM fully loaded and parsed");
});

任何提示有什么问题吗？ 谢谢

Answer 1

编辑：与提问者进行电子邮件对话后，我们确定根本原因是缺少</div>。该代码确实有效。

您的代码有效。 （click here）必须还有其他错误。下面，我对您的JS进行了一些改进：

document.addEventListener("DOMContentLoaded", function(event) {

  $('#headline1').keyup(updateCount).keydown(updateCount);

  function updateCount() {
    var cs = $(this).val().length;
    $('#countHeadline1').text(cs);
    cs = $(this).val();
    $('#headlineText').text(cs);
  }

  console.log("DOM fully loaded and parsed");
});

基本上，我将所有jQuery替换为$，并摆脱了第二个var。我还摆脱了辅助#headline1来清理您的代码。