Заставьте <tr>вести себя как <a>

Question

У меня есть таблица, и я хочу, чтобы каждая строка была кликабельной. Прямо сейчас я делаю простое:

$('tr').click(...)

Это работает по большей части, но как я могу заставить его действовать как ссылка следующим образом:

• Shift-click открывает цель в новом окне
• Среднее нажатие открывает цель в новой вкладке
• При наведении курсора отображается адрес ссылки в строке состояния

Answer 1

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

Переход по маршруту JS / override также не изящно ухудшается ... если все, что вы делаете, это просто ссылки на другую страницу, например, на типичный HREF, то почти глупо делать это зависимым от JavaScript.

Answer 2

Одним из вариантов будет реализация .mouseUp () и определение вручную клавиш shift и ctrl, а также того, какая кнопка была нажата. Это, конечно, звучит склонно к всевозможным уродливым сбоям, в которых вы упускаете некоторые особенности настройки отдельного пользователя.

Вместо этого, как насчет автоматического добавления тега <a> в каждую ячейку, которая делает то, что вы хотите. В jQuery это просто:

$('tr th, tr td').wrapInner('<a href="..."></a>').children('a').click(function() {
    ...
});

Answer 3

Я бы предложил использовать тег <a> внутри каждой ячейки:

<table>
<tr>
  <td><a href="...">...</a></td>
  <td><a href="...">...</a></td>
  <td><a href="...">...</a></td>
</tr>
</table>

С этим CSS:

table.clickRows td > a {
  display: block;
  width: 100%;
  height: 100%;
}

Answer 4

Для чего это стоит, Apple - КРАСНЫЙ, а Бананы - ЖЕЛТЫЙ. Возможно, вы не захотите сжимать его и раскрашивать для здравомыслящих пользователей.

Якорный тег <a> существует для того, что его стоит, как и тег строки таблицы, <tr>.

Answer 5

Вам гораздо лучше пытаться сделать <a> похожим на <tr>.

Браузеры будут гораздо более терпимыми к тому, чтобы вы манипулировали представлением элемента <a>, чем игнорировали бы такие базовые операции, как нажатие на ссылку по нажатию Shift.

Answer 6

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

Поведение правой и средней кнопки мыши, безусловно, зависит от конфигурации браузера.