Длинная страница div: используйте Effect.toggle, чтобы развернуть div внизу: страница прокручивается вверх - PullRequest
Новая
       9

Длинная страница div: используйте Effect.toggle, чтобы развернуть div внизу: страница прокручивается вверх

0 голосов
/ 15 января 2010

У меня есть страница вещей, которая выглядит следующим образом (и да, я включил скриптовые javascripts, потому что переключение действительно работает): 

<html>

<div id="container">
    <div id="thing1" class="thing" >
       <p>Some visible stuff 1</p><a href="#" onclick="Effect.toggle('extra1');">More1</a>
       <div id="extra1" style="display:none;">
         <p>Some extra and initially invisible stuff</p>
       </div>
    </div>

    <div id="thing2" class="thing">
       <p>Some visible stuff 2</p><a href="#" onclick="Effect.toggle('extra2');">More2</a>
       <div id="extra2" style="display:none;">
         <p>Some extra and initially invisible stuff</p>
       </div>
    </div>

   <!-- 96 more entities of class="thing" -->

    <div id="thing99" class="thing">
       <p>Some visible stuff 99</p><a href="#" onclick="Effect.toggle('extra99');">More99</a>
       <div id="extra99" style="display:none;">
         <p>Some extra and initially invisible stuff</p>
       </div>
    </div>
</div>
</html>

Когда я нажимаю на ссылку "More99" с id = "thing99", которая находится внизу страницы, div с id = "extra99" появляется, как и должно быть, но страница затем автоматически переходит на страницу прокручивает обратно наверх.

Когда я нажимаю ссылку «More1» вверху, она остается сфокусированной вверху.

Можно ли в любом случае удержать страницу от прокрутки вверх и / или перефокусировать ее туда, где я только что щелкнул? Я не хочу прокручивать вниз и выяснить, какой из них я только что сделал видимым.

Ответы [ 2 ]

2 голосов
/ 15 января 2010

Попробуйте return false; после ваших Effect.toggle(); звонков. 

<a href="#" onclick="Effect.toggle('extra99'); return false;">More99</a>

Это не идеальный способ справиться с этим, но он должен решить вашу непосредственную проблему. В идеале вы должны удалить весь свой Javascript из HTML и покончить со всеми атрибутами onclick, обрабатывая все из удаленного блока Javascript.

0 голосов
/ 15 января 2010

Джонатан и Тату завели меня на правильный путь. Я попытался «вернуть ложь», и это работало иногда.

Имея в виду концепцию возврата ложного, я искал GOogle и наткнулся на этой странице на hrefs и вернул false

Этот тег "#" возвращал меня в начало страницы. Я попытался href = "" без "return false", и это сработало, как хотелось, но также случайно перезагрузило страницу.

Следующее решение дало мне то, что я хотел последовательно: 

<a href="" onclick="Effect.toggle('extra99'); return false;">More99</a>

Все работало как надо, и никаких случайных перезагрузок страницы.

...