хэш в тегах привязки

Question

Как мне загрузить страницу и открыть ее в определенном месте загруженной страницы?

Например, допустим, у меня есть page1.html, который имеет 3 ссылки

<a href="page2.html#1">1</a>
<a href="page2.html#2">2</a>
<a href="page2.html#3">3</a>

на page2.html, у меня также есть эти ссылки на странице, т.е.

<a href="page3.html#1">1</a>
<a href="page3.html#2">2</a>
<a href="page3.html#3">3</a>

, но когда я нажимаю на ссылку #2 или #3 из page1.html, они всегда открываются вв верхней части страницы, даже если #2 и #3 находятся за пределами экрана на page2.html, который необходимо прокрутить вниз, чтобы увидеть.

Не уверен, что я делаю неправильно.

Answer 1

Вам нужно поставить с именем якоря на page2.html, например так:

<a name="1"></a>
…
<a name="2"></a>
…
<a name="3"></a>

- это было до HTML5.В настоящее время вы используете id вместо name.

Answer 2

Вам необходимо добавить идентификатор к элементу, к которому он должен «перейти».

Например, если у вас есть

<div id="part1">
  <p>Blah blah blah</p>
</div>

<div id="part2">
  <p>Blah blah blah</p>
</div>

<div id="part3">
  <p>Blah blah blah</p>
</div>

И все они находятся в page.html

Затем вы можете связать с page.html#part1, page.html#part2 и т. Д., И он перейдет на правильную часть страницы

Обновление:

Вы также можете использовать имяатрибут, однако я предпочитаю использовать идентификатор.Это потому, что все может иметь идентификатор, но не обязательно имя.Например, я не думаю, что name является допустимым атрибутом для тега 'a' в HTML 5. Также, если у вас есть один элемент с id = "part1" и другой элемент с name = "part1", один с идентификаторомбудет иметь приоритет.Чтобы избежать путаницы, я просто придерживаюсь одного метода.Здесь немного больше обсуждений здесь

Answer 3

Использование атрибута name или id в теге привязки на странице target приведет к желаемому результату.

<a name="someLocation" id="someLocation">SomeText</a>

В соответствии с соглашением XHTML 1.1, атрибут name тега привязки был заменен атрибутом id. В контексте XHTML 1.0 атрибут name считается устаревшим.

См. Этот ответ для обсуждения связанных изменений тега привязки.

Подводя итог: по причинам совместимости многие предлагают использовать как атрибут id, так и атрибут name в одном и том же элементе. В этом случае тег привязки.

Стандарт W3C рекомендует (относительно всех применимых элементов):

Атрибуты id и name имеют одинаковое пространство имен. Это означает, что они не могут одновременно определять привязку с одинаковым именем в одном и том же документе. Разрешено использовать оба атрибута для указания уникального идентификатора элемента для следующих элементов: A, APPLET, FORM, FRAME, IFRAME, IMG и MAP. Когда оба атрибута используются в одном элементе, их значения должны быть идентичны.

Извиняюсь за дублирование, мне не хватает репутации, чтобы комментировать лучший ответ.

Answer 4

Поскольку эти сообщения все еще найдены, я хотел бы добавить обновление:

<a href="#jumppoint">goto '#jumppoint'</a>

действительно переходит к:

<div id="jumppoint">  <!-- name="" does not work here on modern browsers -->
   <h2>here</h2>
</div>

и:

<a name="jumppoint" />
<h2>here</h2>

Answer 5

Либо назовите свои якоря, либо поместите ссылки на ваши элементы:

www.yoursite / index.html # содержание Прокрутит вас до <div id="content">, если он существует, или до <div name="content">.

Answer 6

вы должны присвоить разделам имена или идентификаторы 1, 2 и 3, тогда он будет работать для вас ..