select2 : 按删除键删除选中的元素答案

【问题标题】：select2 : delete the element selected by pressing delete keyselect2 : 按删除键删除选中的元素
【发布时间】：2016-03-15 20:47:52
【问题描述】：

我正在使用 select2 来呈现一个可编辑的选择框，但是当我按下删除键时，在我的控制器中我没有检测到更改范围

<select id="mySelect" ui-select2="{ allowClear: true}"  ng-model="select2">
    <option value="one">First</option>
    <option value="two">Second</option>
    <option value="three">Third</option>
</select>

在我的控制器中我写：

$('#mySelect').keyup(function(e){
    if(e.keyCode == 46) {
        console.log('Delete Key Pressed');
    }
});

有人有想法吗？

【问题讨论】：

标签： javascript jquery angularjs select2

【解决方案1】：

使用 jquery 获取选择值并使用选定值获取选项。

var selected= $('#mySelect').val();//get value
$( "option[value='"+selected+"']" ).remove();//delete option with value selected
$('#mySelect').prop('selectedIndex',0);//clear select

实现示例。

$('#mySelect').keyup(function(e){
    if(e.keyCode == 46) {
        var selected= $('#mySelect').val();
        $( "option[value='"+selected+"']" ).remove();
        $('#mySelect').prop('selectedIndex',0);
      
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.min.js"></script>
<select id="mySelect" ui-select2="{ allowClear: true}"  ng-model="select2">
    <option value="one">First</option>
    <option value="two">Second</option>
    <option value="three">Third</option>
</select>

【讨论】：

感谢您的回复，但我想在按下删除键时取消选择元素；它在我写作时起作用： $('html').keyup(function(e){ });但我想使用 $('#mySelect') 而不是 $('html')
好的，如果您需要取消选择而不是删除，请仅使用$('#mySelect').prop('selectedIndex',0);
如果您需要检查您是否在 select 中工作，有时 select2 会通过其他容器更改您的选择。
事实上，当我使用 $('html').keyup .. 一切正常，但我只想在组合框已被选中时取消选择（$('#mySelect')。）
在html中工作，因为事件是to option，但是select 2使用span，我认为你必须将事件设置为select 2形式