无法从Bootstrap-datetimepicker获取选中日期值的技术求助

看起来你遇到的核心问题是第三方日期选择器（从你的HTML结构判断大概率是Bootstrap Datepicker）不会触发原生的change/input等表单事件——这类组件是通过JS主动设置输入框的值，而非用户手动输入或原生交互触发事件，所以你之前绑定的那些原生事件自然不会生效。

问题根源 #

你用的日期选择器依赖自定义逻辑渲染日历、设置输入框值，它不会触发浏览器原生的表单事件，而是提供了专属的自定义事件来通知日期选中的变化。

正确的解决方案 #

你需要绑定日期选择器容器的changeDate事件（Bootstrap Datepicker的自定义事件），而不是直接绑定输入框的事件：

// 绑定日期选择器的changeDate事件（选中日期时触发）
$('#start_picker').on('changeDate', function(e) {
  // 获取和输入框显示一致的格式化日期值
  var selectedDate = $(this).datepicker('getFormattedDate');
  console.log('选中的日期：', selectedDate);
  
  // 在这里执行你的表格过滤逻辑
  filterTableByDate(selectedDate);
});

// 可选：如果需要在日历关闭时也触发逻辑，可以额外绑定hide事件
$('#start_picker').on('hide', function(e) {
  var selectedDate = $(this).datepicker('getFormattedDate');
  console.log('日历关闭时的日期：', selectedDate);
});

为什么之前的事件无效？ #

• 原生change事件只有在用户手动修改输入框内容并失去焦点时才会触发，日期选择器是通过JS直接修改value属性，不会触发这个事件。
• click事件仅在你点击输入框打开日历的瞬间触发，和日期选中的动作完全无关，所以只有首次点击时能生效。

额外提示 #

如果你用的是其他类型的日期选择器（比如jQuery UI Datepicker），对应的事件会有所不同，示例如下：

$('#startDate').datepicker({
  onSelect: function(dateText) {
    console.log('选中的日期：', dateText);
  }
});

但从你的HTML结构来看，Bootstrap Datepicker的适配性最高，优先尝试第一种方案即可。

内容的提问来源于stack exchange，提问作者murday1983