Muh*_*min 5 javascript highstock bootstrap-datepicker
在选择日期到日期日历后,我不确定是什么导致它被触发三次.这是为其设置的选项rangeSelector
rangeSelector:{
enabled:true,
inputEnabled: true,
inputDateFormat: '%d/%m/%Y',
inputEditDateFormat: '%d/%m/%Y',
inputDateParser: function (value) {
value = value.split('/');
console.log(value);
return Date.UTC(
parseInt(value[0]),
parseInt(value[1]) - 1,
parseInt(value[2])
);
}
}
Run Code Online (Sandbox Code Playgroud)
通过使用backbone.viewjquery选择器,这里我如何启动图表
this.$el.highcharts(Options, this.extra);
以及extra作为触发日期选择器的其他设置
highlightSer: function (chart){
setTimeout(function () {
$('input.highcharts-range-selector', $(chart.container).parent())
.datepicker({
format: "dd/mm/yyyy",
todayBtn: "linked",
autoclose: true,
todayHighlight: true,
orientation: "auto right"
});
}, 0);
}
Run Code Online (Sandbox Code Playgroud)
有人经历过吗?
来自此SO的@seeARMS解决方案对我有用,只需进行一项修改:
为您的活动创建单独的函数
一个函数具有 datePicker 方法和您的设置:
$('input_with_date_picker').datePicker({...});
Run Code Online (Sandbox Code Playgroud)
一个单独的函数控制您的on changeDate事件:
$(document).on('changeDate', 'input_with_date_picker', function({..do something..}));
Run Code Online (Sandbox Code Playgroud)
或者:
$('input_with_date_picker').on('changeDate', function({..do something..}));
Run Code Online (Sandbox Code Playgroud)
由于您添加的功能,您在评论中提供的小提琴正在按预期工作:
$('input.highcharts-range-selector').on('changeDate', function(e) {
alert(e.date);
});
Run Code Online (Sandbox Code Playgroud)
在页面加载时,它会执行两次,因为有两个匹配的元素。它们似乎都是由这个 JS 生成的:
rangeSelector:{
enabled:true,
inputEnabled:true,
inputDateFormat:"%d/%m",
inputEditDateFormat:"%d/%m/%Y",
inputDateParser: function (value) {
value = value.split('/');
console.log(value);
return Date.UTC(
parseInt(value[0]),
parseInt(value[1]) - 1,
parseInt(value[2])
);
}
},
Run Code Online (Sandbox Code Playgroud)
如果您更改任一元素的日期,该函数将执行一次,这就是您帖子的目标。
您可能会指出它不起作用,因为当您从 datePicker 中选择新日期时,日期不会更新。我不知道为什么会这样,我对 highcharts 不熟悉。