无论如何强制jquery对话框垂直滚动条到顶部？

Question

我有一个 jquery 对话框，我用这段代码打开它：

$("#myDialog").dialog("open").css("maxHeight", window.innerHeight - 150);

我在末尾有那个 css() 以确保对话框不比当前用户窗口长，如果是这样，则将其切断并创建一个垂直滚动条。

这很好，但现在我想强制垂直滚动条到顶部，但我似乎无法让它工作。我试过把它放在上面的行之后：

    $("#myDialog").scrollTop(0);

    $("#myDialog").scrollTop();

我也试过这个：

    $("#myDialog").dialog({
        resizable: false,
        height: 'auto',
        open: function () {
            $(this).scrollTop(0);
        },

但对话框打开后似乎没有任何东西强制垂直滚动条到顶部。

Answer 1

将这两个选项添加到您的对话框中，如下所示，默认情况下您的滚动条将位于顶部：

$("#myDialog").dialog({
        maxHeight: window.innerHeight - 15,
        overflow:'scroll'
});

使用类似的东西：

<div id="clickme">click me</div>
<div id="dialog" title="Dialog Title">
    <p>ipt Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.
    jQuery UI is a curated set of user interface jQuery UI is a curated set.</p>
</div>

<script>
$( "#clickme" ).click(function( event ) {
    $( "#dialog" ).dialog( "open" );
    event.preventDefault();
});

$( "#dialog" ).dialog({
    autoOpen: false,
    width: 400,   
    maxHeight: window.innerHeight - 15,
    overflow:'scroll',
    buttons: [
        {
            text: "Ok",
            click: function() {
                $( this ).dialog( "close" );
            }
        },
        {
            text: "Cancel",
            click: function() {
                $( this ).dialog( "close" );
            }
        }
    ]
});

</script>

在http://jsfiddle.net/fmqyw889/1/查看我的代码