Jquery辅助功能键代码无法正常工作

Question

为了实现可访问性，我正在使用keycode jquery函数来删除enter键上的'li'标签。但哪个不起作用。我不知道为什么。我遵循了良好的代码实践并引用了许多代码模型。每个人都说我遵循的方法相同。以下是代码示例...

Jquery代码：

$('.textCapDisplay .removeTag').keydown(function (e) {
            if (e.keyCode == 13) {                    
                $(this).closest('li').remove();                  
            }
        });

动态加载的HTML构造函数...

<ul class="tCDCont">
    <li class="added segoe-ui-symbol"><span class="textCont"> dasfa</span><span tabindex="0" class="removeTag"></span></li>
    <li class="added segoe-ui-symbol"><span class="textCont"> sfas</span><span tabindex="0" class="removeTag"></span></li>
    <li class="added segoe-ui-symbol"><span class="textCont"> fasf</span><span tabindex="0" class="removeTag"></span></li>
</ul>

任何人都可以帮我解决这个问题。

提前致谢。

Answer 1

根据您在此处发布的标记，请尝试使用此选择器：

$('.tCDCont .removeTag').keydown(function (e) {

而不是

$('.textCapDisplay .removeTag').keydown(function (e) {

fiddle

如果动态生成li，则需要event delegation with .on()

$(document.body).on("keydown", ".tCDCont .removeTag", function (e) {

updated fiddle

注意：要解雇keydown事件，应该关注这些图标。