对话框上的jQueryUI Datepicker:在窗口滚动上确定,在对话框滚动上不正常

时间:2015-10-09 18:42:54

标签: jquery-ui jquery-ui-datepicker jquery-ui-dialog

我在这里有以下示例http://jsfiddle.net/209t0drp/
其中在对话框上使用了一个日期选择器。

页面和对话框都有滚动。 在stackoverflow上使用这里的一些例子,我设法在滚动页面时修复对话框,但是现在,当我滚动对话框的内容时,我希望datepicker随着对话框的内容移动,因为它是该部分的一部分。

知道我该怎么做吗?

/*/////// CSS */
body{font-size:12px;}
.fixed-dialog{
  position: fixed;
  top: 150px;
  left: 50px;
}
#container { height: 5000px; }

/*/////// JS */
$(document).ready(function(){

  $('.btnOpenDialog').button().click(function(){  
      $('html, body').scrollTop(0);
      $( ".selector").dialog({ dialogClass:'fixed-dialog',modal:true});

      setTimeout("$('#dt1').focus()",100);
  });
  $('.dt').datepicker();
});

/*/////// HTML */
<div id="container">
    <div style='height:1000px'>
        <div class=filler></div>
        <br><br><span class=btnOpenDialog>Open Dialog</span>   
        <div class=filler></div>
    </div>

    <div class="selector">  <div style='height:200px;'>
        Test: <input type=text>
        <br>Date Two: <input class=dt type=text id=dt1 name=dt1 />
        <div class=filler></div>
    </div>
</div>

0 个答案:

没有答案