My project has a datepicker which has buttons to go previous/next months. it looks like this:
我的项目有一个日期选择器,它具有上一个/下个月的按钮。它看起来像这样:
but when i click the buttons on right and left corner of the control, it suddenly disappears.
但是当我点击控件左右两侧的按钮时,它会突然消失。
jquery function:
jquery函数:
$( "#departDate" ).datepicker({
showOtherMonths: true,
//inline:true,
dateFormat: 'dd-mm-yy',
numberOfMonths: 2,
selectOtherMonths: true,
minDate: 0,
onClose: function (selectedDate) {
$("#arriveDate").datepicker("option", "minDate", selectedDate);
if (!single && $("#arriveDate").val()=="")
$("#arriveDate").focus();
}
});
i tried to comment out onClose:
and minDate
but none of these fixed problem.
我试图评论onClose:和minDate但没有解决这些问题。
When i remove blur function on this datepicker, it stops disappearing. But i need to make it disappear when click anywhere out of this tool.
当我删除此日期选择器上的模糊功能时,它会停止消失。但是当我点击这个工具的任何地方时,我需要让它消失。
3 个解决方案
#1
2
you should add a click event an check for all elements in your datepicker. this might be useful for you:
你应该添加一个click事件来检查你的datepicker中的所有元素。这可能对你有用:
$(document).on("click", function (e) {
var elem = $(e.target);
if (!elem.hasClass("hasDatepicker") &&
!elem.hasClass("ui-datepicker") &&
!elem.hasClass("ui-icon") &&
!elem.hasClass("ui-datepicker-next") &&
!elem.hasClass("ui-datepicker-prev") &&
!$(elem).parents(".ui-datepicker").length) {
$('#departDate').datepicker('hide');
}
#2
1
I think you are using two js files where your next button will override so try to change sequence of js file on your html page
我认为你正在使用两个js文件,你的下一个按钮将覆盖,所以尝试在你的html页面上更改js文件的序列
#3
1
I don't find this problem persist in my fiddle.
我没有发现这个问题在我的小提琴中持续存在。
Since you mentioned,
既然你提到过,
When i remove blur function on this datepicker, it stops disappearing. But i need to make it disappear when click anywhere out of this tool?
当我删除此日期选择器上的模糊功能时,它会停止消失。但是当我点击这个工具的任何地方时,我需要让它消失吗?
I have a workaround solution like whenever you click outside the datepicker, it will be hidden.
我有一个解决方案解决方案,就像你在datepicker外面点击一样,它将被隐藏。
$(document).on('click',function (e) {
var container = $("#departDate");
if (!container.is(e.target)
&& container.has(e.target).length === 0) {
container.hide();
}
});
Check this working in JSFiddle
检查这在JSFiddle中工作
Hope you can understand.
希望你能理解。
#1
2
you should add a click event an check for all elements in your datepicker. this might be useful for you:
你应该添加一个click事件来检查你的datepicker中的所有元素。这可能对你有用:
$(document).on("click", function (e) {
var elem = $(e.target);
if (!elem.hasClass("hasDatepicker") &&
!elem.hasClass("ui-datepicker") &&
!elem.hasClass("ui-icon") &&
!elem.hasClass("ui-datepicker-next") &&
!elem.hasClass("ui-datepicker-prev") &&
!$(elem).parents(".ui-datepicker").length) {
$('#departDate').datepicker('hide');
}
#2
1
I think you are using two js files where your next button will override so try to change sequence of js file on your html page
我认为你正在使用两个js文件,你的下一个按钮将覆盖,所以尝试在你的html页面上更改js文件的序列
#3
1
I don't find this problem persist in my fiddle.
我没有发现这个问题在我的小提琴中持续存在。
Since you mentioned,
既然你提到过,
When i remove blur function on this datepicker, it stops disappearing. But i need to make it disappear when click anywhere out of this tool?
当我删除此日期选择器上的模糊功能时,它会停止消失。但是当我点击这个工具的任何地方时,我需要让它消失吗?
I have a workaround solution like whenever you click outside the datepicker, it will be hidden.
我有一个解决方案解决方案,就像你在datepicker外面点击一样,它将被隐藏。
$(document).on('click',function (e) {
var container = $("#departDate");
if (!container.is(e.target)
&& container.has(e.target).length === 0) {
container.hide();
}
});
Check this working in JSFiddle
检查这在JSFiddle中工作
Hope you can understand.
希望你能理解。