Кнопка «Отправить» в гиперссылке - PullRequest
Новая
       0

Кнопка «Отправить» в гиперссылке

3 голосов
/ 12 апреля 2011

Я бы никогда не подумал, что это правильная разметка, чтобы поместить <input type="submit" /> в якорь <a> примерно так: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Submit input in a hyperlink</title>
</head>
<body>
    <form action="/form-submission" method="get">
        <a href="/hyperlink-click"><input type="submit" /></a>
    </form>
</body>
</html>

Как ни странно, если вы введете это в w3c валидатор , он подтвердит.

Что должно произойти, когда пользователь нажимает кнопку отправки? Будет ли такой тип установки непредсказуемым, если разные браузеры будут делать все, что им заблагорассудится, или существуют явные правила, определяющие ожидаемое поведение? Может ли пригодиться что-нибудь подобное?

Ответы [ 3 ]

3 голосов
/ 12 апреля 2011

Так вот ответ :) Он может не проверяться в HTML5, он может проверяться в HTML <5, но мне все равно было интересно посмотреть, что произошло. Оказывается, это довольно логично. Событие кнопки сначала срабатывает, а затем всплывает до события ссылки. Затем происходит событие ссылки. Вы можете поиграть с ним здесь: </p>

http://jsfiddle.net/yEUM2/

Это делает то же самое в IE8, FF4, Chrome 10

3 голосов
/ 13 апреля 2011

Поведение несовместимо между браузерами.

Милиметрический ответ может быть хорош для javascript, но подумайте, что происходит с неподписанным html.

См. Js fiddlehttp://jsfiddle.net/PjtPZ/

Здесь я только что изменил html вопроса, чтобы ссылка переместилась на страницу на www.microsoft.com, а форма была отправлена ​​на www.google.com.

Нажмите на кнопку в Firefox 4.0, IE9 или Opera 11, и появится страница Google.Сделайте это в Chrome 10.0 или Safari 4.0, и вы получите страницу Microsoft.

Вероятно, поэтому она запрещена в HTML5.

1 голос
/ 12 апреля 2011

Короче говоря, это недействительный HTML. Вероятно, он не должен быть действительным, и, как отмечает Ричард, интересно, что он был рассмотрен в HTML5

Попробуйте запустить тот же код, что и в HTML5. Определение HTML5 исправило это, выдав ошибку: 

The element input must not appear as a descendant of the a element.

Это потому, что вы отображаете две кнопки в одном месте, поэтому какое действие кнопки должно иметь предпочтение? По сути, вы скрываете одно действие кнопки от пользователя, что так же хорошо, как отсутствие второй кнопки вообще.

Подробнее об этом можно узнать в HTML: Справочник по языку разметки

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...