2010-03-10 2 views
9

У меня есть следующий фрагмент HTML, который создает новое окно при нажатии:Создание W3C подтверждена ссылки анкерной с TARGET = «_blank»

<a href="/path/to/site" target="_blank">glide by the people</a> 

Проблема заключается в том, что он не проходит W3C валидатор. Как создать ссылку, как показано выше, которая проверяет?

+3

Возможно, это очевидно для других людей, но этот вопрос для меня не имеет смысла. Можете ли вы немного разобраться? –

ответ

9

Используйте этот доктайп:

<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhmtl1/DTD/xhmtl1-transitional.dtd"> 

1,0 переходные приспосабливают некоторую HTML "унаследованный" код, в том числе цели = "_ пустых".

+0

Есть ли какие-либо способ получить ту же функциональность, не используя при этом переходный doctype? – Nate

+3

Не без использования javascript (см. сообщение от @ajm ниже). Причина, почему это было удалено, вызвано доступностью и взаимодействием с пользователем. Пользователи хотят контролировать этот материал, не popups. :) – ghoppe

6

Предполагая строгую XHTML, вы привязываете событие onclick к рассматриваемому якорю. Что-то вроде:

<a href="/path/to/my/link" onclick="window.open('/path/to/my/link');return false;">My link</a> 

Можно было бы также утверждать, что вы должны быть обязательной, что OnClick действия отдельно с внешним JavaScript вследствие постепенного улучшения и разделения поведения от разметки, но это основной способ пойти об этом.

+6

Незначительная проблема: DRY! замените URL-адрес в обработчике событий onclick на 'this.href'. Также переместите эту вещь в файл JavaScript, а не загромождайте свой HTML. –

1

Вы не можете сделать это с помощью строгой проверки W3C.

Растворы:

  • Transitional DOCTYPE, как уже упоминалось

  • Другой валидатор (например CSE)

  • Использование JavaScript, чтобы заменить "_blank" - см http://www.ajaxblender.com/open-links-new-window-w3c-valid-target-blank.html (ссылку показывает, как сделать это реальным образом с помощью jQuery - я вставляю два примера ниже).

 
    $(document).ready(function(){ 
      $('A[rel="_blank"]').each(function() { 
       $(this).attr('target', '_blank'); 
      }); 
    }); 
    // ...OR... 
    $(document).ready(function(){ 
      $('A[rel="_blank"]').click(function() { 
       window.open($(this).attr('href')); 
       return false; 
      }); 
    }); 
  • Кроме того, в соответствии с this doctype page, HTML5 должен позволить целевой atrtribute быть подтверждено, FOW, что это стоит.
+0

1.) t используйте имена разметки как прописные. Вместо этого используйте строчные буквы. 2.) В этом коде есть синтаксическая ошибка: перед 'false' есть знак« больше ». 3.) Yo u должно четко указать, что это два отдельных решения в коде jQuery. – Sk8erPeter

+0

@ Sk8erPeter - в чем причина №1? – DVK

+0

, конечно, оба работают в jQuery, поскольку обрабатывают теги нечувствительным к регистру образом. Это скорее соглашение об именах; для совместимости с XHTML вам также следует использовать строчные теги в HTML-форматировании, поскольку документы XHTML [могут использовать только теги нижнего регистра] (http://www.w3.org/TR/xhtml1/diffs.html#h-4.2) , Таким образом, вы также должны придерживаться этих соглашений в своих кодах JavaScript. :) [Вот несколько интересных аспектов] (http://wiki.answers.com/Q/Should_you_use_upper_case_or_lower_case_HTML_tags), и [здесь еще один] (http://www.websiteoptimization.com/speed/tweak/lowercase/). – Sk8erPeter

5
  1. проверки является не все, и конец всем качество кодирования.

  2. Некоторые вещи являются «стандартными» в браузерах, не являясь стандартом w3c.

  3. Использование немного JS немного переборщило, когда функция уже существует.

+1

Что делать, если проверка W3C является стандартным требованием кодирования? – Aye

+0

Действительно. Валидация - отличный инструмент, но это не похоже на то, что W3C - это боги, которые все в порядке. Стандарты не идеальны – PatrikAkerstrand

+0

@Lemurik: каждый браузер понимает и принимает target = "_ blank". Просто потому, что он не в стандарте W3C не делает его неправильным. – PatrikAkerstrand

3

Если это только один или два канала, вы можете сделать это рядный с

<a href="http://stackoverflow.com" onclick="window.open(this.href); return false;"></a> 

Более того, и вы, вероятно, хотите один из Js решений выше.

+0

Мне это нравится. благодаря! – Chris

5

Я думаю, что вы задаете неправильный вопрос. Атрибут target недействителен в строгом XHTML 1.0 независимо от того, вставляете ли вы его с помощью JavaScript или просто имеете в ответ сервера.

Если вам действительно нужен этот атрибут, вам нужно использовать другой тип doctype, но это тоже не правильный ответ.

Вы должны спросить себя, почему вы хотите получить атрибут. Я предполагаю, что вы пытаетесь создать новую вкладку или окно. Излишне говорить, что это, как правило, считается плохим дизайном (он берет контроль у пользователя), но если вы действительно этого хотите, вы можете сделать это с помощью JavaScript.

Вот как:

Держите ваши ссылки, но добавить специальный класс, например, «popup» для них. Затем добавьте строку JavaScript (желательно, используя фреймворк, такой как jQuery или Prototype, чтобы он стал проще), который принимает все ссылки с этим классом и дает им обработчик на клиенте, который приводит к созданию новой вкладки/окна и отменяет значение по умолчанию действие (т. е. перестает работать ссылка как ссылка). Тем не менее, это все равно будет раздражать людей, поскольку оно отменяет ожидаемое поведение.

Что вам не следует делать, это заменить ссылки фиктивными ссылками и полагаться на JavaScript для ссылок на работу.

Не обращайте внимания на это. Атрибут target больше не устарел в HTML (уровень жизни или «5», в зависимости от того, следуете ли вы WHAT WG или W3C). Правильный ответ сегодня не просто заменить DOCTYPE с этим:

<!doctype html> 

Обратите внимание, что он больше не должен быть в верхнем регистре, ни на самом деле выглядит как полная декларация DOCTYPE SGML. Это просто рудиментарный артефакт, идентифицирующий документ как совместимый со стандартами HTML.

+0

У меня нет большого количества внешних ссылок, просто на самом деле. Мой документ был полностью одобрен для новой части окна. Здесь я видел много разрешений. Спасибо за ваш ответ – Chris

1
  1. Добавить rel="new-window" атрибут ссылки (вместо target="_blank")
  2. надстройкой Jquery сценария к голове страницы и добавьте следующий фрагмент кода

    <script type="text/javascript"> 
        $(document).ready(function(){ 
         $('a[rel="new-window"]').click(function(){ 
          window.open(this.href); 
         }) 
        }); 
    </script> 
    

(Пожалуйста, обратите внимание, что, как я напечатал это в текстовом поле stackoverflow, я его не тестировал.)

1

На самом деле предлагаемые здесь решения с объявлением ding атрибут «target» с помощью JavaScript полностью совместим со стандартами!

Дело в том, что в соответствии со спецификацией W3C DOM Level 1 интерфейс HTMLLinkElement DO имеет целевой атрибут, хотя элемент A из спецификации HTML 4.01 не имеет его.

Поэтому недопустимо записывать атрибут «target» в html-файле, но он действителен, чтобы добавить его в дерево документа позже через DOM-интерфейсы с использованием JS.

1

Если у вас есть требование для обеспечения доступности или межплатформенной совместимости, вы, вероятно, захотите проверить свою веб-страницу. Есть хороший документ, отвечающий на вопрос «зачем утверждать?». размещено W3.org http://validator.w3.org/docs/why.html

IMHO, это показывает, что вы заботитесь о своей аудитории, когда вы берете дополнительное время для проверки. Затем у вас будут страницы, которые практически одинаковы для IE, Opera, Safari и Firefox.

-1
<a href="..." onclick="return !window.open(this.href)">...</a> 
2

Вместо использования:

мишень = "_blank"

использование:

OnClick = "this.target =" _ пустой"

N ote одинарные кавычки внутри двойных кавычек. Это решило проблему проверки для меня, без необходимости переопределять doctype.