Нажмите Entire Row (сохраняющий щелчок средней кнопкой и ctrl+click)

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

вам нужно удалить тег

и просто использовать атрибут 'href', чтобы получить место назначения ссылки, и не выбирать тег привязки , потому что он содержит href attribute.

$("table#row_link tbody tr a").click(function () {

     window.location = $(this).attr("href");

});

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

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

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

Вдохновленная решением @Nick для очень похожей проблемы, я предлагаю простой css + Решение jquery.

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

jQuery.fn.linker = function(selector) {
    $(this).each(function() {
        var href = $(selector, this).attr('href');
        if (href) {
            var link = $('<a href="' + $(selector, this).attr('href') + '"></a>').css({
                'text-decoration': 'none',
                'display': 'block',
                'padding': '0px',
                'color': $(this).css('color')
            })
            $(this).children()
                   .css('padding', '0')
                   .wrapInner(link);
        }
    });
};

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

$('table.collection tr').linker('a:first');

И весь необходимый CSS:

table.collection {
    border-collapse:collapse;
}

Это так просто.

Вы можете использовать объект события для проверки тип щелчка мышью. В этой статье обсуждается похожая проблема.

В любом случае, вот как это сделать:

$("table#row_link tbody tr").click(function () {

    if((!$.browser.msie && e.button == 0) || ($.browser.msie && e.button == 1)){
        if (!e.ctrlKey) {
            // Left mouse button was clicked without ctrl
            window.location = $(this).find("a:first").attr("href");
        }
    }
});

Вы хотите это:

$('table#row_link tbody tr').mousedown( function(e){
    if(e.ctrlKey || (!$.browser.msie && e.button == 1) || ($.browser.msie && e.button == 4)){
        //middle mouse button or ctrl+click
    } else {
        //normal left click
    }
});

Это проверено в FF3.0.10, Chrome 1.0 и IE6. Я использую событие mousedown, потому что ни Firefox, ни IE не передают щелчок средней кнопкой мыши событию .click (fn).

Вы можете создать ссылку и позволить ей перемещаться в вашем tr, привязавшись к событию mouveover, обновить href и позицию

создать ссылку на один пиксель

<table id="row_link">....</table>
<a id="onepixel" style="position:absolute;z-index:1000;width:1px;height:1px;"></a>

обновить href и положение при наведении курсора

$("#row_link tr").mouseover(
   function(event){
      //update href
      $("#onepixel").attr("href",$(this).find("a:first").attr("href"));
      //update position, just move to current mouse position
      $("#onepixel").css("top",event.pageY).css("left",event.pageX);
   }
);

Вот кое-что, что должно сработать: вместо использования window.location используйте .click () для имитации щелчка по первому элементу внутри элемента. Кроме того, используйте условие для проверки CTRL + щелчок.

Должно выглядеть так:

$("table#row_link tbody tr").click(function (e) {
    if(e.ctrlKey) { 
        // Run Ctl+Click Code Here
    } else { 
        $(this).children('a').eq(0).click(); 
    }
}

Надеюсь, это поможет!

Дэйв Ромеро

Попробуйте поместить a вокруг td, а затем применить display: block Элемент CSS для td.

Это должно сделать всю область td доступной для нажатия со всеми кнопками в качестве "обычной" ссылки.

Пример, вероятно, лучше:

<table id="row_link"> 
  <tbody> 
    <tr>
      <a href="link1.html"><td style="display: block;">link</td></a> 
      <td>info 1</td> 
    </tr>       
    <tr>
      <a href="link2.html"><td style="display: block;">link</td></a>
      <td>info 2</td> 
    </tr>       
  </tbody> 
</table>

Подобный подход работал в прошлом для мне, хотя это было не совсем для элементов таблицы. Не тестировал с таблицами, так что попробуйте.

Я думаю, что плагин largelink сделает то, о чем вы просите. Вот статья

• , а также
• демонстрация .

Я бы напал на это со стороны HTML / css. Раньше это была распространенная проблема, когда большинство сайтов делали всю компоновку в виде таблиц.

Сначала сделайте содержимое всех ячеек таблицы ссылками. Если вы не хотите, чтобы они выглядели как ссылки, вы можете использовать CSS, чтобы удалить подчеркивание из ячеек «без ссылок». Но они будут ссылками, что в любом случае семантически то, что вам нужно.

Затем вы хотите, чтобы ссылка расширялась, чтобы заполнить всю ячейку. StackOverflow уже знает ответ на этот :

td a { дисплей: блок; ширина: 100%; высота: 100%; высота строки: 100%; }

В типичной таблице без пробелов между ячейками вся строка будет активна. И поскольку здесь нет никаких уловок или специальных взломов браузера, он должен работать везде.