jQuery UI 日期选择器问题答案

【问题标题】：jQuery UI datepicker issuesjQuery UI 日期选择器问题
【发布时间】：2010-05-26 20:25:36
【问题描述】：

我正在尝试在我的应用程序中显示一个基本的 jQuery 日期选择器。当用户单击输入字段时，将显示一个日历。当日历弹出时，我的输入字段位于窗口底部。它在 Firefox 和 Chrome 中显示正常（在输入字段上方），但在 IE 中显示不正常（在输入字段下方弹出并且日历被 IE 底部切断）。我想知道这里是否有人可以帮助我。非常感谢！

样本

alt text http://www.parkerandassociates.org/jquery.JPG

我的 jQuery：

$("#addMatch").live('click', function(){

 $(this).closest('tr').before("<//input field #datepicker
"<tr><td>Date: <input type='text' id='datepicker' size='6' name='date'></td>"+ 
"<td colspan='3'>Time: <select><option>13:00</option>"+
          "<option>18:00</option>"+
          "<option>19:00</option>"+
          "<option>20:00</option>"+
          "</select></td>"+
          "</tr>");

 $("#datepicker").datepicker({ changeMonth: true, changeYear: true, yearRange: '2010:2020'});

 return false;
});

【问题讨论】：

您是在发布的代码中遗漏了<tr>，还是在其中插入了无效的html（例如未打开的行）？
感谢您指出尼克。我只在这里粘贴了部分 html 代码。我的 html 在我的文件中很好。

标签： jquery datepicker html-lists

【解决方案1】：

也许您应该尝试使用 .offset() 函数修复它。

然后向下滚动页面一些像素，这样您就可以确定所有日历都显示出来了。

查看this website上的示例

<div id="scrollToHere">
Scroll to here
</div>

You need something to run your script. Create a button like this:

<input type="button" onclick="scollWin();" value="Scroll up" />

The jQuery Code will be like this:

function scrollWin(){
    $('html,body').animate({
        scrollTop: $("#scrollToHere").offset().top
    }, 2000);
}

【讨论】：