sma*_*key 6 html javascript jquery datepicker
我在div上使用jQuery UI datepicker.div通过移动鼠标来隐藏和显示.因为日期选择器存在于<body>标记的末尾,而不是在我的div中,所以当我将鼠标移动到datepicker时div会消失.
我像这样加载了datepicker:
使用Javascript
$("#dt1").datepicker({
dateFormat: "dd/mm/yy",
showOn: "button",
buttomText: "Arrival date",
buttonImage: "<button location>",
buttonImageOnly: true,
});
HTML
<input type="text" id="dt1" size="10" name="dt1" value="Arrival Date" />
如何将datepicker的容器设置为特定的div？
编辑:在JSFiddle上看到它:http://jsfiddle.net/G4NzC/
解决方案是将dataPicker的div移动到hidden-absolute-located-div中.
像这样的东西(这只是@andrew的想法,但你需要改进CSS样式和其他东西):
注意,这#dt1是日期的输入文本,#ui-datepicker-div是datepicker的div,#bookingBox是hidden-absolute- located -div.
$("#dt1").datepicker({
dateFormat: "dd/mm/yy",
showOn: "button",
buttomText: "Arrival date",
buttonImage: "http://www.inbar.co.il/designFiles/Inbar_Ico_Calander.png",
buttonImageOnly: true,
beforeShow:function(textbox, instance){
$('#ui-datepicker-div').css({
position: 'absolute',
top:-20,
left:5
});
$('#bookingBox').append($('#ui-datepicker-div'));
$('#ui-datepicker-div').hide();
} });