3

次のようなコードを含む単純なWebフォームがあります。

//...
//tons of text
//...
<a name="message" />
//...
//tons of text
//...
<asp:Button ID="ButtonSend" 
                runat="server" 
                text="Send"
                onclick="ButtonSend_Click" />

POSTの後、ユーザーをアンカー「メッセージ」に移動したいと思います。私はこれのために次のコードを持っています:

protected void ButtonSend_Click(object sender, EventArgs e)
{
this.ClientScript.RegisterStartupScript(this.GetType(),
                                        "navigate",
                                        "window.location.hash='#message';",
                                        true);
}

この単純なJavaScriptはFirefox3.5.2では機能しません-URLはブラウザで変更されますが、ページはアンカーに移動されません。IE 8では、完全に機能します。

このJavaScriptコードがFirefoxで機能しないのはなぜですか?私は何かが足りないのですか?

4

4 に答える 4

7

問題を解決しました。アンカーが存在する前に JavaScript コードが呼び出されました。そのため、Firefox はページを下にスクロールしませんでした。

私のコードは次のようになります。

this.ClientScript.RegisterStartupScript(this.GetType(),
                                        "navigate",
                                        "window.onload = function() {window.location.hash='#message';}",
                                         true);

ページの読み込み後、単純な JavaScript 関数を呼び出しています。

解決策を見つける鍵は、クレイトンの答えでした。Firebug は、getElementById が null 参照を返していることを報告しています。次に、andrewWinn が提案したように生成された HTML を調べました - アンカーが存在する前に JavaScript が呼び出されました。少しグーグルで解決策を見つけました。

回答ありがとうございます。

于 2009-08-20T19:07:26.997 に答える
5

Mendoza、ネイティブのscrollIntoView関数を使用できます。

やりたいことをするには、次のように記述します。

this.ClientScript.RegisterStartupScript(this.GetType(),
                                        "navigate",
                                        "document.getElementById('id_of_the_element').scrollIntoView();",
                                        true);
于 2009-08-20T17:31:20.717 に答える
1

私はこれに一度出くわしました。実際の HTML をご覧になりましたか。私の記憶では、FireFox はアンカーで大文字と小文字を区別していました。それが最近変わったかどうかはわかりません。

于 2009-08-20T18:13:20.350 に答える
0

jQuery LocalScroll pluginを使用してみてください。これを使用すると、次を使用してスクロールできます。

$(function() {
    $.scrollTo("#message");
});

または ASP.NET コードで:

protected void ButtonSend_Click(object sender, EventArgs e)
{
    this.ClientScript.RegisterStartupScript(this.GetType(),
                                            "navigate",
                                            "$(function() { $.scrollTo('#message'); });",
                                             true);
}

特にプロジェクトのどこにもjQueryをまだ使用していない場合は、理想的なソリューションではありませんが、問題を解決できる可能性があります。

于 2009-08-20T18:22:07.417 に答える