Jquery UI對話框 - 打開時IE7瀏覽器立即移動到頁面底部

Question

我一直在研究一個新的.net MVC網站，並集成了一些非常棒的jquery UI組件。

我一直在IE8，FF，歌劇和Chrome中測試它，一切看起來都很好。 一旦我在IE7中測試，令人驚訝的是它的對話框導致了問題。

基本上發生的事情是，用戶點擊打開對話框，頁面將立即滾動到頁面底部。 如果頁面很長，這尤其糟糕。

這只發生在IE7（可能是6但我甚至不去那里！）。

我花了幾個小時閱讀論壇，似乎我不是唯一一個。

我創建了一個骯臟的黑客，我不熱衷但它確實有效。

onclick="SignIn();  <% if(ModelHelperClass.CheckForOldIEVersion() == true) Response.Write("window.scrollTo(0, 0);"); %> return false;">

有沒有其他人有這個問題並解決它而不訴諸骯臟的黑客？

即時通訊使用jquery-ui-1.8.custom.min.js和jquery-1.4.2.min.js

任何幫助都非常感謝

Truegilly

更新---

你好，謝謝你的回應 -

在我的頁面頂部，我有這個聲明......

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

我包括這些文件....

<link href="/Scripts/css/blitzer/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/jquery-1.4.2.min.js" ></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.1.custom.min.js" ></script>

這是我的登錄功能 - 其他對話框非常相似

// Sign in to the site
function SignIn() 
{
    $("#SignIn").dialog({
        bgiframe: true,
        modal: true,
        resizable: false,
        buttons: {

            'Sign In': function () {

                // the username and password
                var Username = $("#Username").val();
                var Password = $("#Password").val();

                var dataString = 'Username=' + Username + '&Password=' + Password;

                // AJAX here....

                // when the user clicks sign in, the form is submitted                
                //$("#SignInForm").submit();
            },
            Cancel: function () {
                $(this).dialog('close');
            }
        }
    });
}

正如我所說，它在除IE7之外的所有瀏覽器中都能正常工作

Answer 1

我有與IE7相同的問題，並使用最新版本的jquery，並沒有任何流浪逗號。

修復結果很簡單 - 對CSS的一個簡單補充。 添加.ui-dialog{ position: absolute; overflow:hidden } .ui-dialog{ position: absolute; overflow:hidden }在IE7中修復它。

Answer 2

對話框是否使用position: fixed ？ IE7僅在標准模式下表示榮譽，但在怪異模式下，它會在正常頁面流中插入這樣的對話框，導致頁面的其余部分向下移動。

因此，如果您真的處於標准模式，我們應該仔細檢查：

Doctype聲明必須是文檔中絕對的第一件事（不得有任何評論或其上方的任何內容！）
我會用<!doctype html>測試，因為將IE7（以及所有現代瀏覽器）置於標准模式下效果非常好，而且輸入錯誤更加困難。

Answer 3

我將.ui-dialog的jquery-ui.css類從相對位置更改為絕對位置。 測試了IE 7,8,9，Chrome 14.0.835.163 beta-m，Safari 5.1，FireFox 3.6.16

Answer 4

沒有一個CSS技巧對我有用。

我是如何修理它的：

HTML

<a href="javascript:openDialogFunction(parameters)">...</a>

使用Javascript

function openDialogFunction(parameters) {

    var topOff = $(window).scrollTop();

    //code to open the dialog

    $(window).scrollTop(topOff);
}

Answer 5

我以前遇到過這個問題，但這只是因為我沒有包含jQuery UI CSS。 而且，老實說，這聽起來像是一個CSS問題。

你是如何制作對話框的？ 我看到了“SignIn”功能，但它包含什么？ （順便說一句，您可以在.dialog（）方法中手動設置對話框的位置......不確定這是否會對您有所幫助）

此外，請確保您的瀏覽器符合標准模式。 如果您處於Quirks模式，則可能會對應用的任何樣式產生影響。 如果您不知道如何執行此操作，至少需要聲明DOCTYPE。 像<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">的頂部HTML。

Answer 6

我有這個問題但是當我升級到jquery 1.4.4和jqueryui 1.8.7時它就消失了

Answer 7

我已經解決了它刪除html代碼中的逗號：

照顧寬度：715

之前：

$(function(){
// Dialog           
$('#dialog').dialog({
autoOpen: false,
width: 715,});

后：

$(function(){
// Dialog           
$('#dialog').dialog({
autoOpen: false,
width: 715
});

IE7在有逗號的行中報告了一個錯誤。

Jquery UI對話框 - 打開時IE7瀏覽器立即移動到頁面底部

問題描述

7 個解決方案

解決方案1
6 2011-04-25 23:31:44

解決方案2
1 2010-06-04 18:40:46

解決方案3
1 2011-09-22 21:09:32

解決方案4
0 2013-03-08 16:08:33

解決方案5
0 2010-06-03 18:50:24

解決方案6
0 2010-12-13 22:55:08

解決方案7
0 已采納 2010-12-22 11:26:45

Jquery UI對話框 - 打開時IE7瀏覽器立即移動到頁面底部

問題描述

7 個解決方案

解決方案1 6 2011-04-25 23:31:44

解決方案2 1 2010-06-04 18:40:46

解決方案3 1 2011-09-22 21:09:32

解決方案4 0 2013-03-08 16:08:33

解決方案5 0 2010-06-03 18:50:24

解決方案6 0 2010-12-13 22:55:08

解決方案7 0 已采納 2010-12-22 11:26:45

解決方案1
6 2011-04-25 23:31:44

解決方案2
1 2010-06-04 18:40:46

解決方案3
1 2011-09-22 21:09:32

解決方案4
0 2013-03-08 16:08:33

解決方案5
0 2010-06-03 18:50:24

解決方案6
0 2010-12-13 22:55:08

解決方案7
0 已采納 2010-12-22 11:26:45