Question

我试图从单击保存按钮closest()的位置获取.save_entry select2值。

我正在尝试使用$(this).closest('select').val();获取select的值，但是它将返回未定义的值。我尝试了许多变体，但是由于select2生成了其他HTML，因此似乎在尝试最接近该值时存在问题。我在页面上有多个选择，因此我必须使用一个类。

如何获取最接近选择的值？

<div class="input-group">
    <select class="form-control select2custom" style="width: 100%">'+data+'</select>
    <span class="input-group-btn">
        <button class="btn btn-primary btn-sm save_entry" type="button" data-id="'+row_id+'">
            <i class="fas fa-check"></i>
        </button>
    </span>
</div>

JQUERY

$(document).on('click', '.save_entry', function() {
    var new_value = $(this).closest('select').val();
})

Answer 1

closest()仅搜索元素的父级。 select元素不是按钮的父级。找到div，然后找到选择的子项。

考虑到标记，一种可行的方法是找到最接近的输入组，然后找到嵌套的select2custom元素，即select。

$(this).closest('.input-group').find('.select2custom')

Answer 2

塔普拉（Taplar）的回答很好，您也可以将delegateTarget类替换为document（在这里为input-group），以更轻松地找到select选择器。

$('.input-group').on('click', '.save_entry', function(e){
   
   console.log( $(e.delegateTarget).find('select').length )
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="input-group">
    <select class="form-control select2custom" style="width: 100%">'+data+'</select>
    <span class="input-group-btn">
        <button class="btn btn-primary btn-sm save_entry" type="button" data-id="'+row_id+'">
            <i class="fas fa-check">Click me</i>
        </button>
    </span>
</div>

警告：调用此事件声明时，必须确保存在.input-group标记才能起作用。

获取壁橱的价值select2 jquery

2 个答案: