如何获取jQueryui对话框scrollTop将对话框内容滚动到顶部

Question

我有一个jQueryui对话框,我正在加载很多内容(服务条款协议),当内容溢出时会导致滚动条.这就像我希望的那样.但是,一旦对话框打开,我希望滚动条位于顶部(这样用户可以从初始化开始阅读而无需向上滚动).对话框的设置是

$(function() 
{
$( "#tos_dialog" ).dialog({
    title: 'Terms Of Service Agreement',
autoOpen: true,
height: 480,
    width: 640,
modal: true,
    show: "blind",
hide: "explode",
    buttons: {
       "I Accept": function() {
        $( this ).dialog( "destroy" );
                $("#login_container").dialog( "destroy" );
                window.location.replace('/main.php');
    },
            "I Decline": function() {
                $( this ).dialog( "destroy" );
            }
        }
    });

我已尝试将autoOpen设置为true和false,并且我尝试了以下所有代码以尝试将内容滚动到顶部:

  $("#tos_dialog").show()
  $("#tos_dialog").scrollTop();
  $( ".ui-dialog" ).show();
  $( ".ui-dialog" ).scrollTop();
  $(".ui-widget-content").show();
  $(".ui-widget-content").scrollTop();
  $("body").scrollTop();
  $('#tos_dialog', window.parent.document).scrollTop(0);

不幸的是,以上似乎都没有起作用.我也尝试将上面的绑定事件放在对话框上,对于dialogOpen和对话框调整大小都无济于事.任何帮助将不胜感激.

Answer 1

尝试

$("#the_dialog_div").scrollTop("0")

这对我有用!

Answer 2

这对我有用

$(function() 
{
 $( "#tos_dialog" ).dialog({
  title: 'Terms Of Service Agreement',
  autoOpen: true,
  height: 480,
  width: 640,
  modal: true,
  show: "blind",
  hide: "explode",
  buttons: {
   "I Accept": function() {
    $( this ).dialog( "destroy" );
      $("#login_container").dialog( "destroy" );
      window.location.replace('/main.php');
   },
   "I Decline": function() {
      $( this ).dialog( "destroy" );
   }
  },
  open:funtion(){
    //Solution HERE
    $(".ui-dialog-content").scrollTop(0);
    //End of Solution
  }
});

Answer 3

好吧，我终于找到了一种破解方法来让它发挥作用。虽然人们似乎可以使用scrollTop(“0”)和/或其他潜在的东西，但这些都不适合我。如果您也遇到这种情况，请尝试以下操作：

创建与 nbsp 的链接；作为其文本（因此它不会立即看起来像链接）。使其成为您希望显示的对话框的显示区域中的第一个 HTML（在我的例子中，它是对话中显示的我的服务条款的顶部）。

然后，在声明对话框时，添加打开函数作为参数，并包含线条以模糊元素内的所有链接，然后将焦点设置在顶部的链接上。下面是适合我的初始化代码。

$(function() {
    $( "#tos_dialog" ).dialog({
  title: 'Terms Of Service Agreement',
        autoOpen: false,
      height: 480,
  width: 640,
        modal: true,
    show: "blind",
        hide: "explode",
  open: function () 
  { 

    $('.ui-dialog-relative :link').blur();
    //setTimeout(function() { $('#tos_top').focus();}, 4000);
    $('#tos_top').focus();
  },
  focus: function(event, ui) {$('#tos_top').focus(); },
  buttons: {
            "I Accept": function() {
                $( this ).dialog( "destroy" );
      $("#login_container").dialog( "destroy" );
      window.location.replace('/nextpage.php');
            },
            "I Decline": function() {
                $( this ).dialog( "destroy" );
            }
        }
    });
    $( "#tos_dialog" ).dialog("open");
});

希望这可以帮助其他人作为最后的选择，因为无论出于何种原因，他们都无法首先使用标准方法。