jQuery ограничивает то, что принимает событие click () - PullRequest
1 голос
/ 12 июля 2011

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

Вот некоторые HTML, которые яиметь.Я не могу изменить его.

<td class="DayStyle" align="right" style="color:#CEE2ED;border-color:#CEE2ED;border-width:3px;   border-style:solid;width:14%;">
    <a title="July 19" style="color:#CEE2ED" href="javascript:__doPostBack('myCal','4217')">19</a>
</td>

Я использую этот jQuery для выполнения этого прямо сейчас:

$(".myCal").find("td.DayStyle").click(function() {
   //DoStuff
});

Если в рамках этой функции я получу '$ (this).attr ("class")) ', я всегда получаю DayStyle, предположительно потому, что это то, что ловит щелчок.

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

Подходы, которые я рассматриваю :: 1) Попытка также захватить события .click (), которые щелкают поэлемент "а" и ничего не делать.2) Найти, где пользователь нажимает и проверить, есть ли текст или «а» в этом месте.3) Как-то указав в функции щелчка, что нажатие на «а» или что-либо с атрибутом «заголовок» или что-то не так.

Ответы [ 3 ]

4 голосов
/ 12 июля 2011

Попробуйте использовать event.target

$(".myCal").find("td.DayStyle").click(function(e) {
   if($(e.target).hasClass('DayStyle')) {

   }
});

или

if(!$(e.target).is('a')) {

}
1 голос
/ 12 июля 2011

В этом случае вы также можете использовать делегат для оптимизации вашего кода.

$(".myCal").delegate("td.DayStyle", "click", function(e) {
   if(!$(e.target).is('a')) {
      //do Stuff
   }else{ //do nothing or someother logic goes here }
});
1 голос
/ 12 июля 2011

Попробуйте это:

$('td.DayStyle a').click(function(event){

    try
    {
        // Prevent click event from travelling up the DOM tree
        event.stopPropagation();
    }
    catch(err)
    {
        // IE does it this way
        window.event.cancelBubble=true;
    }
});
...