当我在 daterangepicker 上触发更改事件时未触发其他 ID答案

【问题标题】：Other IDs not triggered when i trigger change event on daterangepicker当我在 daterangepicker 上触发更改事件时未触发其他 ID
【发布时间】：2021-03-15 05:54:31
【问题描述】：

当我在 datepicker 上触发更改事件时，它工作正常，但未触发其他 ID 的更改事件。但是，当我将日期范围 ID 放在末尾时，更改事件对所有 ID 都有效，但不适用于日期范围。我想使用此更改事件适用于所有 ID，包括日期范围选择器。

 $(document).on('change', '#sell_list_filter_date_range', '#sell_list_filter_location_id, #sell_list_filter_customer_id, #sell_list_filter_payment_status, #created_by, #sales_cmsn_agnt, #service_staffs', function () {
         // here change event works fine for only daterange  
       
        });

$(document).on('change', '#sell_list_filter_location_id, #sell_list_filter_customer_id, #sell_list_filter_payment_status, #created_by, #sales_cmsn_agnt, #service_staffs','#sell_list_filter_date_range', function () {
             // here change event works fine for all IDs instead for Date range id
           
            });

【问题讨论】：

为什么不使用通用的class 并在其上附加监听器？
帮我做这件事。
发布了答案@ZAIN

标签： javascript jquery dom-events

【解决方案1】：

如果 onchange 事件对每个下拉菜单都有相同的逻辑，您可以只使用通用的class 作为选择器，以避免在您的工作中造成混淆和不必要的代码。您可以通过在要附加侦听器的每个下拉列表中添加 classnames 来做到这一点。

<select class="listen" id="id-here">
  ...
</select>
<select class="listen" id="some-unique-id-here">
  ...
</select>

然后您可以将侦听器附加到change

$(function(){
  $('.listen').on('change', function(){
     /* 
      Now regardless of the dropdown's id, 
      you can now refer to the element by using $(this)  
     */

     var value = $(this).val();
     alert(value);

  })

})

【讨论】：