JQuery .Parent()

Ok вот мой HTML (одна строка около 20)JQuery .Parent()

<tr class="post-unauth message-unread"> 
    <td> 
    <input class="check-read" type="checkbox" checked="checked" value="68"/> 
    </td> 
    <td class="message-description" title="Post Title"> 
    </td> 
    <td class="message-author">Name</td> 
    <td class="message-dates">3 hours ago</td> 
    <td class="message-commentcount" title="0 comment(s)"> 
    </td> 
</tr>

Теперь, когда флажок щелкнули мне нужно изменить класс родителя

$('.check-read').click(function() { 
     $(this).parent().parent().removeClass('message-unread').addClass('message-read'); 
});

I Я не вижу ничего очевидного, я думаю, что это не работает (не ошибка), но ничего не меняется.

Я даже попытался установить цвет фона CSS и не вносить изменения в HTML.

Любые предложения?

источник

2010-01-21 LiamB

у вас есть сообщение для чтения по tr, и вы удаляете сообщение-непрочитанное – Martin

, это просто опечатка. – LiamB

Указывает ли Firebug класс, добавляемый к элементу? Это даст вам знать, является ли это проблемой CSS или проблемой jQuery. Если у ваших селекторов нет элементов, это не будет ошибкой при действии на пустой набор. Он просто ничего не сделает. В вашем примере на родительском родителе нет класса 'message -readread', но я не думаю, что это должно быть проблемой. – Mark

Я думаю, вы должны попробовать ближе всего. Это новое в JQuery 1.3

$(this).closest("tr").removeClass('message-unread').addClass('message-read');

closest docs

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

$(this).closest(".message_row").removeClass('message-unread').addClass('message-read');

А затем добавьте «message_row» в свой tr. Если у непроверенного окна гарантированно есть непрочитанный текст, вы можете использовать его для своего селектора вместо добавления класса message_row и выбора его.

источник

2010-01-21 15:05:17 sberry

Я печатал это, так как ваш ответ вошел. Ближайшее действительно удобно в таких случаях. Я бы попытался использовать класс вместо тега, так как изменения на рынке менее хрупки для jQuery. – Mark

Согласитесь с предложением класса ... Я также добавлю это. – sberry

Мне нравится эта идея, и здесь это работает очень хорошо, но будет ли это продолжаться, если в будущем они добавят новый перед этим флажком?Я имею в виду еще самые близкие возвращения, которые tr или следующие tr? Моя идея/предложение будут связаны с tr и флажком с некоторым префиксом id и в зависимости от того, что найдет элемент, который будет каким-то глупым prrof для будущих изменений DOM. –

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

$(".classForEachPost").click(function(e){ 
    var $target = $(e.target); 
    var $this = $(this); 

    if($target.is(".check-read:checkbox")){ 
     $this.removeClass("message-unread").addClass("message-read"); 
    } 

    // check for other click events in the TR you might want to act upon 
});

Мне нравится эта картина, когда есть много действий подряд, Div и т.д. Он останавливается много обходе вверх и вниз на графике и централизовать все маркеры событий в одном месте. Мне намного проще обернуть это в плагин jQuery.

$.fn.myPostRow = function(){ 
    this.click(function(e){ 
     // same code as above 
    } 
};

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

$(".tableOfPosts TR").myPostRow();

Это будет только JavaScript смешивается с HTML-разметкой и плагин может быть перемещен к JS-файл.

Ответ полностью отступил от вашего первоначального вопроса, но, надеюсь, он по-прежнему полезен.

источник

2010-01-21 15:23:23 Mark

JQuery .Parent()

ответ

Смежные вопросы