选择"OnChange same value"两次

Question

我有一个选择框，它使用jQuery将文章添加到列表中，如下所示：

$('#articles').on('change', function(e) {
//adds article to list
}

这很好，但当我尝试添加同一篇文章两次时，onChange方法不会启动，因为它已经被选中了。

解决这个问题最好的方法是什么？

我不想取消选择它，因为它会向用户显示他们之前选择的项目，并且onClick功能也不太好用。

Answer 1

您可以通过在选项标记上使用单击事件来实现这一点。

$('#articles').on('click', 'option', function(e) {
//adds article to list
console.log($(this).val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="articles">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>

每次单击某个选项或更改某个选项时都会调用该事件，然后可以像以前一样将其添加到数组中。

Answer 2

使用select2插件可以使用：

$('#articles').on('select2:close', function(e) {
...
}

这将触发该功能，即使它已经被选中。

感谢：@Pete在评论中的回答

Answer 3

使用select2((

$('#articles').select2().on('click', function() {
console.log('selected : ', $(this).val());
});

$('#articles').select2().on('click', function() {
console.log('selected : ', $(this).val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<select id="articles">
<option>1</option>
<option>2</option>
<option>3</option>
</select>