Как добраться до потомка родителя родителя?
Вот такой у меня хтмл
<div class='comment'> <div class='info'> <a href='JavaScript:void(0);' class='link_comment'> <span>Коментарии</span></a> </div> <div class='picture'> </div> <div class='comment_text' style='display:none;'></div> <div class="dashed_line"></div> </div> По нажатию на ссылку "комментарии" я хочу чтобы у меня div class='comment_text' приобрёл свойство display:block. $(document).ready(function(){ $(".link_comment").click(function () { $('div.review_text').css('display', 'block'); }) }) Но, таких div class='comment_text' у меня несколь ко на странице, а мне нужно открыть конкретный, тоесть сложность состоит в том, чтобы добраться до родителя родителя (можно сказать дедушки) относительно нажатой ссылки, и применить стиль к потомку с классом .review_text . Читал инфу в инете но чето не вьехал. Помогите пожалуйста разобраться |
Цитата:
$(document).ready(function(){ $(".link_comment").click(function () { $('div.review_text').parent().parent() }) }) Либо http://jquery-docs.ru/Traversing/parents/#expr $(document).ready(function(){ $(".link_comment").click(function () { $('div.review_text').parents('comment') }) }) |
ни так ни так не работает. И к тому же мне нужно произвести изменение с элементом который состоит в том же диве что и на нажатая ссылка .link_comment тоесть еще тут должно быть this
|
Цитата:
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function(){ $(".link_comment").click(function () { $(this).parent().parent().find('.comment_text').css('display', 'block'); }) }) </script> </head> <body> <div class='comment'> <div class='info'> <a href='JavaScript:void(0);' class='link_comment'> <span>Коментарии</span></a> </div> <div class='picture'> </div> <div class='comment_text' style='display:none;'>comment_text</div> <div class="dashed_line"></div> </div> </body> </html> |
$(this).parent().parent().find('.comment_text').cs s('display', 'block');
Спасибо огромное! выручил реально |
я бы сделал попроще.
$(document).ready(function() { // делегирование событий. комментов та много будет ? $(".comment").delegate(".link_comment", "click", function(e){ // поднимаемся до общего родителя и опускаемся до этого элемента $(this).parents(".comment").find(".comment_text"). //что делаем с ним *!* toggle() */!* }); }) в принципе, красную строчку можно заменить на show(), тогда элемент не будет скрываться при посторном нажатии. пример <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function() { $(".comment").delegate(".link_comment", "click", function(e){ $(this).parents(".comment").find(".comment_text").toggle() }); }) </script> </head> <body> <div class='comment'> <div class='info'> <a href='JavaScript:void(0);' class='link_comment'> <span>Коментарии</span></a> </div> <div class='picture'> </div> <div class='comment_text' style='display:none;'>comment_text</div> <div class="dashed_line"></div> </div> </body> </html> PS. ksa, О_о |
Часовой пояс GMT +3, время: 10:00. |