更改事件不适用于使用 jquery 的 span 标签答案

【问题标题】：change event doesn't work with span tag using jquery更改事件不适用于使用 jquery 的 span 标签
【发布时间】：2021-06-10 20:51:12
【问题描述】：

我有以下输入：

  <div class="input-group date">
      <input type="text" class="form-control" id="casting_date_naissance" name="casting_date_naissance">
      <span class="input-group-text input-group-append input-group-addon" id="spanEstPaymentDate">
        <i class="simple-icon-calendar"></i>
      </span> 
  </div>

还有这个脚本：

 var dateinput = document.getElementById("casting_date_naissance");
dateinput.addEventListener('change', function(evt) {
  alert('a');
  console.log(dateinput);
});

为什么当我执行这个脚本时更改事件没有触发，当我删除时

<span class="input-group-text input-group-append input-group-addon" id="spanEstPaymentDate">
            <i class="simple-icon-calendar"></i>
          </span>

从 Html 中，更改事件确实会触发。

【问题讨论】：

标签： jquery ajax laravel

【解决方案1】：

在我这边测试您的代码时，无论有无 span 类，一切似乎都按预期工作。

您确定要使用 on change 事件而不是 on input 事件吗？ https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event

【讨论】：

在这种情况下如何输入事件？
在 html 元素的焦点发生变化之前，on change 事件不会执行，on input 事件将在与输入框关联的每个按键上执行

【解决方案2】：

也许这可以帮助某人，我用这段代码解决了我的问题。

 $(document).ready(function(){

     $('#casting_date_naissance').change(function (evt) {
 
          var dateinput = $('#casting_date_naissance').val();
          alert(dateinput);

 });

});

【讨论】：