Question

我正在尝试在IE6网站上使用JQuery UI datepicker（最新的稳定版本1.5.2）。但我在IE6上遇到组合框（选择）的常见问题，它们浮动在其他控件之上。在宣布没有运气的日期选择器之后，我尝试添加bgIframe插件。

我的猜测是，在显示日历之前，我附加bgIframe的.ui-datepicker-div不存在。

我想知道是否可以将.bgIframe（）命令直接放入datepicker .js文件中，如果可以，在哪里？（凯尔文运气的类似控制使用这种方法）

当前代码

$（ “DateItem”）。日期选择器（{
showOn： “按钮”，
......等...... }）;
$（ “UI-日期选择器-DIV”）bgIframe（）;

Answer 1

默认情况下应该为您处理。

iframe默认包含在日期选择器中的IE6中。它的样式，称为ui-datepicker-cover，用于处理透明度。唯一不是这种情况的是旧的themeroller代码，风格不在那里。

Answer 2

我也非常担心这个问题。解决方案如下。

$(".DateItem").datepicker({
  showOn:"button",
  beforeShow:function(){
    $('#ui-datepicker-div').bgiframe();
  },
  ... etc ...
});

Answer 3

我注意到Marc的评论，即ui-datepicker-cover样式应该处理这个问题。在我的情况下，日历的右边和底边仍然会显示下降。

看起来iFrame的大小最初是由以下代码行设置的

if ($.browser.msie && parseInt($.browser.version, 10) < 7) // fix IE < 7 select problems
$('iframe.ui-datepicker-cover').css({ width: inst.dpDiv.width() + 4, height: inst.dpDiv.height() + 4 });

在postProcess函数中。

每次日期由行

更改时，都会重置此大小

inst.dpDiv.empty().append(this._generateHTML(inst)).
find('iframe.ui-datepicker-cover').
css({ width: dims.width, height: dims.height });

我的简单解决方案是删除这两组代码并修复.css文件中封面样式的大小

//if ($.browser.msie && parseInt($.browser.version, 10) < 7) // fix IE < 7 select problems
//    $('iframe.ui-datepicker-cover').css({ width: inst.dpDiv.width() + 4, height: inst.dpDiv.height() + 4 });

inst.dpDiv.empty().append(this._generateHTML(inst))//.    <=== note the // before the .
//find('iframe.ui-datepicker-cover').
//css({ width: dims.width, height: dims.height });

在css文件中将.ui-datepicker-cover的宽度设置为220px，高度为200px

史蒂夫

Answer 4

我有这样的东西，并使用bgIframe插件，只是我把bgiframe();函数放在onBeforeShow() datepicker的方法

检查

$('#date').DatePicker({
format:'Y/m/d',
date: $('#date').val(),
current: $('#date').val(),
position: 'r',
onBeforeShow: function(){
    $('#date').DatePickerSetDate($('#date').val(), true);
    $('.datepickerContainer').bgiframe();
},
onChange: function(formated, dates){
    $('#date').val(formated);
    $('#date').DatePickerHide();
}
});

如何在IE 6上使用带有bgIframe的JQuery UI datepicker

4 个答案: