javascript - onchange函数被触发两次

标签 javascript html jquery

我想将 JQuery 多日期选择器中的值用于不同的目的,但由于某种原因,当我对得到的值进行测试时,我不断得到相同的东西两次。我错过了什么吗?

我的代码:

$('.date').datepicker({
  multidate: true,
  format: 'dd-mm-yyyy'
});

function printDates() {
  var dates = document.getElementById("date_input").value;
  console.log(dates);

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js'></script>


<input type="text" name="dates" class="form-control date" id="date_input" placeholder="Pick the dates " onchange="printDates()">

最佳答案

使用changeDate代替onchange,如下所示

$('.date').datepicker({
  multidate: true,
  format: 'dd-mm-yyyy'
})
.on('changeDate', function(e) {
       printDates(); // `e` here contains the extra attributes
    });
;

function printDates() {
  var dates = document.getElementById("date_input").value;
  console.log(dates);

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js'></script>


<input type="text" name="dates" class="form-control date" id="date_input" placeholder="Pick the dates " >

关于javascript - onchange函数被触发两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61819607/

相关文章:

html - 仅CSS的砌体布局

html - 链接到外部 css 文件

javascript - 黑莓 7 上解析错误谷歌地图 javascript v3

javascript - 无法将动态数据加载到 ui-grid 下拉列表中

javascript - 将 javascript 日期正确格式化为 MySQL

javascript - jQuery 验证不适用于 Web 表单

javascript - 基于 web.sitemap 的 n 层动态菜单

javascript - 变量在一个 JS 文件的多个 HTML 文件中持续存在的问题

javascript - 排除外部库被 bundle 在 webpack 中?

jquery - 将多个 div 移动到列表中的其他 div