ASP.NET переходит к якорю в коде позади

У меня есть простая веб-форма с таким кодом:

//...
//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 не работает в Firefox 3.5.2 - URL-адрес меняется в браузере, но страница не переходит к якорю. В IE 8 работает отлично.

Почему этот код JavaScript не работает в Firefox? Я что-то упускаю?


javascript asp.net anchor
person GTD    schedule 20.08.2009    source источник
comment
кажется, у меня работает ... используя FF 3.0.13 // IE8, оба браузера отлично прокручиваются вниз ... я действительно думаю, что это должно работать, но вы можете попробовать код Cleiton, если это не так.   -  person Lil'Monkey    schedule 20.08.2009

Ответы (4)


arrow_upward
7
arrow_downward

Я решил свою проблему. Код JavaScript был вызван еще до того, как появился мой якорь. Вот почему Firefox не прокручивал страницу вниз.

Мой код теперь выглядит так:

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

После загрузки страницы я вызываю свою простую функцию JavaScript.

Ключом к найденному решению был ответ Клейтона. Firebug сообщает, что getElementById возвращает нулевую ссылку. Затем я посмотрел на сгенерированный HTML, как предложил andrewWinn - JavaScript был вызван до того, как появился якорь. Немного погуглил и нашел решение.

Спасибо за ваши ответы!

person GTD    schedule 20.08.2009
comment
Если вы не укажете # в сообщении, Firefox, кажется, добавит его сам. Пытался назначить .hash для записи параметров запроса в URL-адрес на стороне клиента (без обновления страницы) без успеха. - person George Birbilis; 22.06.2016

arrow_upward
5
arrow_downward

Mendoza, вы можете использовать встроенную функцию scrollIntoView.

Чтобы сделать то, что вы хотите, просто напишите:

this.ClientScript.RegisterStartupScript(this.GetType(),
                                        "navigate",
                                        "document.getElementById('id_of_the_element').scrollIntoView();",
                                        true);
person Cleiton    schedule 20.08.2009
comment
Ваше решение тоже не работает :( Протестировано на Firefox 3.5.2 и IE 8. Также протестировано на другом компьютере с Firefox 3.0.10 и IE 8 - не работает. Я просто не понимаю:/ - person GTD; 20.08.2009
comment
@Mendoza, я тестировал его с IE6 и Firefox 3.5.2, и он работал нормально. Я думаю, ты сделал что-то не так. Например, у вашего якоря должен быть идентификатор, чтобы это решение работало. - person Cleiton; 20.08.2009

arrow_upward
1
arrow_downward

Я столкнулся с этим однажды. Вы взглянули на фактический HTML? Насколько я помню, FireFox был чувствителен к регистру в якорях. Я не знаю, изменилось ли это в последнее время или нет.

person andrewWinn    schedule 20.08.2009
comment
Этот ответ должен быть комментарием. Это вопрос к автору исходного вопроса, и предположение, что я не знаю - person perfectionist; 04.12.2017

arrow_upward
0
arrow_downward

Вы можете попробовать использовать плагин jQuery LocalScroll. Используя это, вы можете прокручивать, используя:

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

Или с вашим кодом ASP.NET:

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

Это не идеальное решение, особенно если вы еще не используете jQuery в своем проекте, но оно может решить вашу проблему.

person Mun    schedule 20.08.2009