Якорь JavaScript - доступ к идентификатору на другой HTML-странице
У меня две страницы html, когда вы нажимаете что-то на первом html, он переходит на второй. Что я хочу сделать, так это показать текст в соответствии с тем, что вы щелкнули в первом html. разные тексты имеют разные идентификаторы. Вот как я написал:
<a href = "secondpage.html#one"></a>
<a href = "secondpage.html#two"></a>
<a href = "secondpage.html#three"></a>
Я ожидаю увидеть, что файл two.html загрузит текст с идентификатором «один», но он не работает. Кто-нибудь знает, что я сделал не так?
Вот код на второй странице:
<ul id = "menu" class = "aaa">
<li><a id = "one" href = "#">one</a></li>
<li><a id = "two" href = "#">two</a></li>
<li><a id = "three" href = "#">three</a></li>
</ul>
И у меня есть файл JS для изменения каждого идентификатора:
$("one").observe('click', function() {
$('Pic').writeAttribute('src',"picone.jpg");
$('Bio').update("texthere!");
});
То же самое для двоих и троих.
Прямо сейчас, если я нажму кнопку на первой странице, всегда будет отображаться текст и рисунок для «одного», независимо от того, какую кнопку я нажимаю.
Но я хочу увидеть картинку и текст для «двойки», если я нажму на нее.
@christine: Может быть, ты сможешь отредактировать свой вопрос и включить [намного] больше своего кода?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 5
Когда вы говорите «разные идентификаторы», как вы настраиваете якоря на 2-й странице? Якорь на 2-й странице должен выглядеть так:
<a name='one'></a>
Поместите это прямо над текстом, который вы хотите отметить на 2-й странице.
привязка на 2-й странице похожа на <a id = "one"> </a>, мне нужно использовать имя?
#blastuffbla - это не идентификатор, а хэш местоположения. Вы можете получить к нему доступ, используя:
self.document.location.hash
который вернет #hash, если вам нужен только хеш, который вы использовали бы:
self.document.location.hash.substring(1)
Надеюсь это поможет
Вы хотите прокрутить страницу до позиции идентификатора "один"? Возможно, содержимое страницы слишком мало, и вы не можете его прокрутить. Я имею в виду, что иногда браузер не может переместить элемент, отмеченный идентификатором, в верхнюю часть холста и выглядит так, как будто он там прокручивается. Постарайтесь оставить после элемента достаточно места, чтобы его можно было прокручивать в верхнюю часть окна браузера.
Надеюсь, это поможет.
Что вы хотите сделать, так это имитировать щелчок по привязке при загрузке страницы. Поскольку вы используете jQuery, самым простым подходом (но далеко не лучшим) будет следующий:
$(window).observe('domready', function () {
$(location.hash).click();
});
прикрепить событие ondomready к окну. Получите элемент с id = one (с jQuery это будет '#one', так же, как ваше location.hash, в этом случае очень удобно), щелкните по нему.
Возможно, вам потребуется заменить $ (location.hash) .click (); с помощью $ (location.hash) .get (0) .click (), поскольку jQuery имеет тенденцию возвращать массивы объектов jQuery.
Но лучшим решением в вашем случае было бы иметь обработчик событий, который вы можете запускать вручную, что позволяет обойти необходимость запуска событий, а также отбросить якоря и поставить onclick прямо на ваши li.
И, кроме того, зачем вы загружаете вторую страницу, если все, что вам нужно, - это динамически отображать / скрывать контент? Сделайте это на той же странице ...
Теги не имеют идентификаторов, но имеют имена для обработки якорей в URL-адресах, хотя вам все равно понадобится идентификатор для управления ими в JS. Итак, ваш список должен быть:
<ul id = "menu" class = "aaa">
<li><a id = "one" name = "one" href = "#">one</a></li>
<li><a id = "two" name = "two" href = "#">two</a></li>
<li><a id = "three" name = "three" href = "#">three</a></li></ul>
Однако ваш javascript казался правильным.
Похоже, вы ищете гораздо больше, чем простой ответ - похоже, вам нужно узнать намного больше о HTML, JavaScript и т. д.