编程语言
首页 > 编程语言> > 如何使用Javascript / jQuery将事件处理程序绑定到删除数组项?

如何使用Javascript / jQuery将事件处理程序绑定到删除数组项?

作者:互联网

所以我要玩的这个迷你程序有4个方面:

>主显示屏(一次显示输入的字符串1);
>用户输入单词的表格;
>一个独立的数组,用于存储每个用户输入的字符串;和
>控制面板(微型显示屏),显示用户当前输入的所有字符串.

当前,当用户输入字符串时,它将被发送到容器数组.从阵列转到显示器和控制面板.我添加了事件处理程序功能,该功能允许用户双击控制面板中的条目,然后仅从控制面板中删除该条目…(但是我还需要双击事件来删除它数组中的条目)

$(".controlbox").on('dblclick', 'p', function() {
    $(this).closest('p').remove();
});

查看原始代码:

FIDDLE

因此,我将如何绑定此事件处理程序,以便它也导致从容器数组中删除条目? (因此,这还将导致该条目从主显示中删除,这是我的目标)

我希望用户能够从控制面板中删除条目,而不是必须从数组中删除数组的元素.换句话说,我希望控制面板充当控制面板,因此需要以某种方式将该事件处理程序链接回容器数组.

解决方法:

您可以通过索引将控制台中的条目(双击的条目)与容器数组中的条目相关联.也就是说,控制台中的条目组成了“ .container”元素的子级列表,并且具有与容器数组中的条目相同的索引.

因此,可以使用以下命令从容器数组中删除条目.

$(".controlbox").on('dblclick', 'p', function() {
    var $entry = $(this);
    container.splice($entry.index(), 1);
    $entry.remove();
});

jsfiddle

标签:event-handling,arrays,javascript,jquery
来源: https://codeday.me/bug/20191122/2058769.html