Статьи

jQuery Открыть все гиперссылки в новом окне

Ноябрь 6, 2018

Код JavaScript отрывает для настройки ваших гиперссылок с помощью CSS с помощью jQuery, чтобы выделить их. Также совет, чтобы открыть гиперссылки в новом окне, используя jQuery.

Открыть гиперссылки в новом окне 

//open all hyperlinks in a new window using jQuery
$('a[href^="http://"]')
  .attr("target", "_blank");
  $(this).attr('href', newHref).attr("target", "_blank");

Вы даже можете добавить изображение или текст к вашей гиперссылке с небольшим количеством цепочек. Этот пример добавляет [^] в конец текста вашей ссылки.

Пользовательский стиль внешних гиперссылок 

 //open all hyperlinks in a new window using jQuery
//also append a "^" to every link that is external (contains "http://")
$('a[href^="http://"]')
  .attr({
    target: "_blank", 
    title: "Opens in a new window"
  })
  .append(' [^]');

Затем добавьте немного jQuery: 

 $(document).ready(function() {
    $("a[@rel='external']").addClass("external").
       .click(function() { window.open($(this).href); return false; });
});

Это находит все теги привязки с rel = ”external” и заставляет их открывать новое окно при нажатии. «Return false;» также предотвращает переход текущей страницы на URL. В качестве дополнительного преимущества эти ссылки получают класс CSS «внешний», поэтому их можно стилизовать, например, с помощью чего-то вроде:

Добавить фоновое изображение для внешних гиперссылок 

 //change background image of external hyperlinks
A.external {
  padding-left: 15px;
  background: url(external-link.png) top left no-repeat;
}

37
Share: