JQuery: исключить флажок из выбора в строке таблицы

Question

У меня есть таблица и скрипт jquery, который выполняет две вещи:

1) Когда строка наведена, цвет фона изменяется путем добавления класса наведения

2) Ссылка, содержащаяся в строке, используется для ссылки на всю строку.

<script type="text/javascript">
$(document).ready(function() {
    var target = 'table.mytable tr.allrows';
    var hoverClass = 'allrows_hover';

    $(target).each(function() {
        $(this).hover(
            function() {
                $(this).addClass(hoverClass);
                status = $(this).find('a').attr('href');
            },
                function() {
                    $(this).removeClass(hoverClass);
                    status = '';
                });
        $(this).click(function() {
            location = $(this).find('a').attr('href');
        });
        $(this).css('cursor', 'pointer');
    });
});
</script>

Теперь проблема в том, что у меня есть флажок в одном столбце в каждой строке, и когда я отмечаю флажок, он переходит по ссылке.

Я подумал об исключении этого столбца из приведенного выше, но не могу заставить это работать. Может ли кто-нибудь помочь мне найти способ исключить либо флажок td, либо, что еще лучше, сам флажок, чтобы я мог щелкнуть по нему, но при этом получить приятный эффект наведения на остальную часть строки?

Заранее спасибо.

Answer 1

может работать

  $(this).click(function(e) {
                location = $(this).find('a').attr('href');
                e.stopPropagation();
                return false;
            });

Answer 2

Ну, у меня есть решение. Не уверен, что это лучше, но ...

Я добавил класс 'noclick' к tds, содержащему флажок. Это добавит класс наведения на всю строку при наведении курсора мыши на любую из ячеек в этой строке, но не создаст ссылку для ячеек с классом noclick.

<script type="text/javascript">
$(document).ready(function() {
    var target = 'table.mytable tr.allrows td';
    var hoverClass = 'allrows_hover';

    $(target).each(function() {
        $(this).hover(
            function() {
                $(this).parent().addClass(hoverClass);
                status = $(this).parent().find('a').attr('href');
            },
                function() {
                $(this).parent().removeClass(hoverClass);
                    status = '';
                });
        $(this).not('td.noclick').click(function() {
            location = $(this).parent().find('a').attr('href');
        });
        $(this).not('td.noclick').css('cursor', 'pointer');
    });
});
</script>

Answer 3

ваш обработчик кликов получает объект события jQuery . атрибут target должен указывать, какой элемент dom получил щелчок. в вашем случае вы не назначите местоположение, если e.target является флажком .. не проверено на вашем коде, но я сделал аналогичный