jQuery 首先：选择器在函数 运行 之后不起作用一次

Question

当按下键功能第一次运行时，它会按照我的预期进行，并将第一个 class 更改为 addBack。此后的每个按键都无效。 html 下面显示的是 1 次按键后。

html:

 <h1 id="id1">
    <span class="addBack">H</span>
    <span class="noBack">E</span>
    <span class="noBack">L</span>
    <span class="noBack">L</span>
    <span class="noBack">O</span>
 </h1> 

jQuery:

    inputBox.keydown(function() {
    $("span.noBack:first").removeClass("noBack").addClass("addBack");
    });

Answer 1

原回答

似乎很适合我：

$('#inputBox').keydown(function() {
    $("span.noBack:first").removeClass("noBack").addClass("addBack");
    });

.addBack { color: green; }
.noBack {color: red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h1 id="id1">
    <span class="addBack">H</span>
    <span class="noBack">E</span>
    <span class="noBack">L</span>
    <span class="noBack">L</span>
    <span class="noBack">O</span>
 </h1> 
 
 <input id="inputBox" type="text" />

除了添加 class 之外还有什么变化吗？比如更改输入（事件）或重新创建 dom 元素以使事件丢失？

编辑后的答案 - 似乎确实发生了更多导致问题的事情。

原文fiddle（来自问题下方的评论）：https://jsfiddle.net/HYUTS/y0jd2zxr/5/.

已修复 fiddle：https://jsfiddle.net/y0jd2zxr/7/。

此行在每次按键事件后重置 'id1' 的内容： $('#id1').html(emptyArray);.

如果您删除它，它会起作用。