代码之家 › 专栏 › 技术社区 › ArtOfWarfare

我无法捕获Select2事件-我怀疑我使用了错误的jquery选择器

jquery-select2-4 jquery-select2 jquery javascript

0

ArtOfWarfare · 技术社区 · 4 年前

这是我写的javascript,它提醒我 .select2 select 元素并将消息记录到控制台,但我从select2框中选择的内容的任何更改实际上都不会记录或提醒我更改。我怀疑我使用了错误的选择器来查找要附加这些对象的对象 change 侦听器,但我在文档中找不到有关如何查找 select2 元素。

$(document).on('change', '.select2-input', function(e) {
    console.log('Detected a different change!');
    alert('The other method of detecting changes worked!');
});
$('.select2').on('change', function(e) {
    console.log('Detected a change!');
    alert('Something was changed!');
});
console.log('Loaded!');
alert('Loaded v2 - found ' + $('.select2').length + ' instances of select2 and ' + $('select').length + ' instances of select.');

0 回复 | 直到 4 年前

1

2

fdomn-m 4 年前

如何找到我的select2元素

这与转换文件时使用的选择器相同 select 选择2,例如:

$('.my-select-dropdown').select2();

我不创建select2实例

如果select2是在别处生成的,您可以找到原始的 选择

$(".select2-hidden-accessible")

关键的信息是事件是针对 选择

// this happens elsewhere that you don't have control over
$('.select2').select2();

// find the original "converted" drop downs
$('.select2-hidden-accessible').on('select2:select', function (e) {
    var data = e.params.data;
    console.log(data.id, data.text, $(".select2").val());
});

.select2 { width: 150px }

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"></script>

<select class="select2">
  <option value="AL">Alabama</option>
  <option value="AK">Alaska</option>
  <option value="AZ">Arizona</option>
</select>