Обновление статуса посещения ссылки при изменении ее атрибута href в Chrome

0

Когда я обновляю ссылки с помощью JavaScript

$('#link_id').attr('href', some_new_url)

цветная тема для посещенных /non- посещенных ссылок сохраняется, независимо от статуса нового URL-адреса.

Есть ли способ изменить адрес ссылки, заставляя браузер повторно проверять его статус посещения?

Дальнейшие примечания:

Я (в OSX 10.8) испытываю эту проблему в Chrome (32) и Safari (6.1). В Firefox (26) статус ссылок обновляется автоматически, если требуется.

Пример выше в jQuery, но проблема аналогична с ванильным JavaScript, то есть document.getElementById и setAttribute.

(Я бы предпочел избегать удаления и добавления <a></a>, если это возможно.)

РЕДАКТИРОВАТЬ:

Минимальный (non-) рабочий пример (Joeytje50): http://jsfiddle.net/3pdVW/

  • 0
    Я не уверен, что понимаю вашу просьбу. Вы хотите настроить стиль посещенных ссылок, чтобы каждая ссылка всегда была одного цвета, независимо от статуса посещения?
  • 0
    Это прекрасно работает для меня: jsfiddle.net/3pdVW (Chrome 32, Win7). Не могли бы вы привести пример JSFiddle, который демонстрирует вашу проблему?
Показать ещё 4 комментария
Теги:
hyperlink
google-chrome
safari

4 ответа

1
Лучший ответ

Окончательный ответ

Что вы можете сделать, чтобы исправить это, просто заставляет браузер пересчитывать стили, полностью удаляя атрибут href, а затем снова добавляя его обратно сразу же после этого. Это заставит браузер сначала вычислить стили, так как <a> больше не является ссылкой без href, а затем вы добавляете href вы хотите дать. Тогда код будет выглядеть следующим образом:

$('#link_id').removeAttr('href').prop('href', some_new_url);

демонстрация

PS: в этом случае, используя .attr('href', some_new_url); вероятно, будет работать одинаково хорошо.

Предыдущие попытки

Я думаю, что это сбой рендеринга. Он не пересчитывает стили, когда состояние :visited изменяется из-за сценария. Этот минимальный пример вашей проблемы показывает это хорошо. Что вы можете попробовать, либо одно из следующих:

Использование свойств элемента

Проблема может заключаться в том, что вы меняете атрибут, который, в свою очередь, изменяет свойство href. Если вы напрямую измените свойство href, оно может работать. Вы можете сделать это через jQuery.prop, который использовал бы следующий код для изменения ссылки:

$('#link_id').prop('href', some_new_url);

Демо. На самом деле я не очень надеюсь на это, но стоит попробовать. То, что я подозреваю, будет работать намного лучше:

Принуждение к пересчету стилей

Если вы хотите принудительно пересчитать стили, вы можете просто изменить класс на самый высокий элемент, который хотите обновить. Поскольку вы обновляете только элемент <a>, вам нужно что-то вроде этого:

$('#link_id').prop('href', some_new_url).toggleClass('webkit-force-recalculate');

демонстрация

Я думаю, что это, скорее всего, сделает трюк.

Если ни один из этих подходов не работает для вас, вы, конечно, можете использовать решение максигладкова.

Поделиться
  • 0
    Ни один не решает проблему, ни для Chrome, ни Safari, на моем компьютере. Спасибо за примеры, хотя!
  • 0
    @PiotrMigdal не могли бы вы попробовать это , вместо этого переключает класс на теле, и посмотреть, работает ли он?
Показать ещё 3 комментария
1

Часто возникают аналогичные проблемы, например, при настройке размера элементов с границей, есть блуждающие границы слева и т.д.

Хотя это не то же самое, я обнаружил, что скрытие элемента делает трюк. У нее не было никаких проблем.

Простая скрипка

$("#change_link").on("click", function(e) {
    $("#anchor1").hide();
    $("#anchor1").attr('href', $("#url").val());
    $("#anchor1").show();
});

Это должно привести к переделке элемента.

Поделиться
  • 1
    Работает! (Как в Chrome, так и в Safari.)
  • 0
    (Я не могу принять два ответа, поэтому я даю вам награду!)
Показать ещё 1 комментарий
1

Вы можете изменить его следующим образом:

$('#link_id').replaceWith($('<a href="' + some_new_url +'">' + $('#link_id').text() + '</a>'));

Это должно сделать трюк. Протестировано: http://jsfiddle.net/maximgladkov/L3LMd/

Поделиться
  • 0
    "(Я бы предпочел не удалять и не добавлять <a> </a>, если это возможно.)" --OP. Этого альтернативного ОП не искали, даже если он работает.
  • 0
    @ Joeytje50 Я предпочитаю, а не требую. :) Если не возможно, я пойду с этим.
Показать ещё 4 комментария
0

Я думаю, что вы можете найти следующий код CSS:

a:link {
    text-decoration: none;
    color: #00F;
}
a:visited {
    color: #00F;
}
Поделиться
  • 0
    Я хочу иметь разные цвета. Конечно, я могу замаскировать проблему, но это не цель.
  • 0
    Я не уверен, что ты имеешь в виду. Можете ли вы обновить свой вопрос, чтобы лучше понять ваши требования и пример использования? Потому что ваш вопрос звучит так, будто вы просто не хотите, чтобы у посещенных ссылок был цвет посещенной ссылки по умолчанию в браузере.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню