2011-12-27 12 views
2

私の問題はthisと多少似ています。しかし、私の実装は少し異なるので、私は新しい質問を作成しました。Google ChromeのJavascriptリダイレクトの問題

私は、戻るボタンを無効にするページがあります(多くのグーグルの後にスクリプトがあります)。このページの動作は、別の場所にリダイレクトされることです(ASP.NET MVCコントローラアクション)。アクションの完了に時間がかかるため、待機メッセージが表示されます。以下は、戻るボタンを無効にしてページをリダイレクトするために使用したスクリプトです。

<script type="text/javascript"> 
    function changeHashOnLoad() { 
     window.location.href += "#"; 
     setTimeout(changeHashAgain, 50); 
    } 

    function changeHashAgain() { 
     window.location.href += "1"; 
    } 

    var storedHash = window.location.hash; 
    window.setInterval(function() { 
     if (window.location.hash != storedHash) { 
      window.location.hash = storedHash; 
     } 
    }, 50); 

    //do after all images have finished loading 
    $(window).load(function() {  
     changeHashOnLoad();   
     //show the wait message 
     $("#domWaitMessage").show(); 
     //redirect to the new page/controller action 
     window.location.href = document.forms[0].action; 
    }); 
</script> 

上記のコードは、IEとFirefoxでは動作しますが、Chromeでは動作しません。 Operaでは多くの画面がちらつきますが、リダイレクトはまだ機能しています。クロムでは、私のコントローラ内のアクションが呼び出され、処理が行われますが、処理が完了してもページはリダイレクトされません。皆さんのほとんどは、フロー/実装を変更する必要があると感じているかもしれませんが、私はこの問題に言及していないので、この流れに固執する必要があります。

Platform: ASP.NET MVC 2.0
jQuery Version: 1.4.1
Chrome Version: 16.0.912.63m

UPDATE:以下

シオマネキやクロームネットワーク]タブから取られたスクリーンショットです。

フィドラー:
Fiddler Screenshot http://img43.imageshack.us/img43/638/200response.png

クローム:
Chrome Screenshot http://img594.imageshack.us/img594/6381/chromenetwork.png

HTML

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Dummy Title</title> 
</head> 
<body> 
    <form id="form1" method="post" action="Home/BookingConfirmation">  
     <div id="domWaitMessage"> 
      <img src="Content/images/preloader.gif" alt="Please Wait...." /> 
     </div>  
    </form> 
</body> 
</html> 

UPDATE WORKING SCRIPT

代わりに getAttribute("action")を使用しての
<script type="text/javascript"> 
    function changeHashOnLoad() { 
     window.location.href += "#"; 
     setTimeout(changeHashAgain, 50); 
    } 

    function changeHashAgain() { 
     window.location.href += "1"; 
    } 

    var storedHash = window.location.hash; 
    window.setInterval(function() { 
     if (window.location.hash != storedHash) { 
      window.location.hash = storedHash; 
     } 
    }, 50); 

    //do after all images have finished loading 
    $(window).load(function() {  
     changeHashOnLoad();   
     //show the wait message 
     $("#domWaitMessage").show(); 
     //ORIGINAL REDIRECTION CODE 
     //window.location.href = document.forms[0].action; 
     //NEW WORKING REDIRECTION CODE 
     setTimeout(function() { window.location.href = document.forms[0].action; }, 100); 
    }); 
</script> 
+2

私はこれが*原因*であるとは思っていませんが、FYIでは、あなたのタイムアウト期間に文字列を使用しているという点であなたの 'setTimeout'は奇妙です。また、関数呼び出しのための文字列は必要ありません。その行を次のように置き換えることができます: 'setTimeout(changeHashAgain、50);' – Jacob

+0

@Jacob、それを試みましたが、まだ動作しません。しかし、あなたの提案は、よりクリーンな、ありがとう! –

答えて

5

、これは何が起こるかである。)

  1. 機能changeHashOnLoad(履歴(「#1」)における第2のハッシュを格納するためにタイムアウトを設定します。しかし、機能は現在実行されていない

  2. メインコードがdocument.formsへのリダイレクトを行う行に実行を継続します(これは50ミリ秒になります)[0] .action

  3. 今のみ:タイムアウトし関数changeHashAgain()が実行されます。ページは「#1」にリダイレクトされ、リダイレクトはdocument.forms [0]にリダイレクトされます。アクションがキャンセルされました

簡潔で迅速な回避策:メインのリダイレクトを遅らせます。

setTimeout(function() { window.location.href = document.forms[0].action; },100); 

「なぜChromeですか?」と言うことができます。 ? Chromeと彼のjavascript engine V8は他のブラウザよりもはるかに高速です。 50msでは、クロムはまだリダイレクションを開始していますが、FFとIEはありません!

+0

ウーホーオーオ、うーん!!!!あまりにも@Artimuzありがとう。 –

0

は次のようにしてみてください:

window.location.href = document.forms[0].action; 
+0

申し訳ありませんが、まだ動作しません。 –

+0

それは私のために働く。あなたは一例としてフルページを提供してください。つまり、アクション属性を持つフォームですか? –

0

これはクロムに私のために動作します。完全なコードを提供していないので、どこにエラーがあるのか​​は分かりませんが、上のコードには含まれていないようです。実際に

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title></title> 
     <link rel="stylesheet" type="text/css" href="class.css" /> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    function changeHashOnLoad() { 
     window.location.href += "#"; 
     setTimeout(changeHashAgain, 50); 
    } 

    function changeHashAgain() { 
     window.location.href += "1"; 
    } 

    var storedHash = window.location.hash; 
    window.setInterval(function() { 
     if (window.location.hash != storedHash) { 
      window.location.hash = storedHash; 
     } 
    }, 50); 

    //do after all images have finished loading 
    $(window).load(function() {  
     changeHashOnLoad(); 

     //show the wait message 
     $("#domWaitMessage").show(); 
     //redirect to the new page/controller action 
     window.location.href = document.forms[0].action; 
    }); 
</script> 
    </head> 
    <body> 
    <form method="post" action="gotothispage.page"> 
    <div style="display: none" id="domWaitMessage">HELLO</div> 
    </form> 
    </body> 
</html> 
+0

私はHTMLセクションも追加しました。 –

関連する問題