时间戳

首页 > 解决方案 > jQuery 附加 Select Change() 事件

javascript - jQuery 附加 Select Change() 事件

问题描述

 $('.add').on("click", function () {
        $('.selects').append('<select><option value="1">Added 1</option><option value="2">Added 2</option></select>');
      });
    
      $(".selects select").change(function () {
        alert("Success");
      });
 <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
 <div class="selects">
    <select>
      <option value="1">1</option>
      <option value="2">2</option>
    </select>
 </div>
 <div class="add">
      Add Select
 </div>

附加选择过程中的alert()更改不起作用。

我正在等待你的帮助。

标签： javascriptjqueryhtml

解决方案

你需要做$(document).on('change','.selects select', function() {});。您需要这样做的原因是因为 DOM 是在页面加载后动态添加的，并且由于您想要侦听动态生成元素的更改事件，因此您需要从该选择元素的级别侦听change事件。document

$('.add').on("click", function() {
  $('.selects').append('<select><option value="1">Added 1</option><option value="2">Added 2</option></select>');
});

$(document).on('change','.selects select', function() {
  alert("Success");
});
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>

<div class="selects">
  <select>
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
</div>

<div class="add">
  Add Select
</div>

推荐阅读