siblings в таблице
Здравствуйте, есть такая проблема. Вот скрипт
$(document).ready(function(){ /* Start DocumentReady */ $("a.hideBtn").click(function(){ $(this).toggleClass('show').siblings('div.hideCont').slideToggle('normal'); return false; }); /* End DocumentReady */ }); он прекрасно работает в такой конструкции <a class="hidebtn" href="javascript://" title="Показать\Скрыть блок">Показать</a> <div class="hideCont" style="display:none">Бла бла бла текст</div> но если поместить в таблицу, то скрипт прекращает работать <table> <tr> <td> <a class="hidebtn" href="javascript://" title="Показать\Скрыть блок">Показать</a> </td> </tr> <tr> <td> <div class="hideCont" style="display:none">Бла бла бла текст</div> </td> </tr> </table> Нужно сделать именно в таблице, чтобы искался следующий за "hidebtn" блок "hideCont", помогите пожалуйста. Вариант с id не подходит, так как таких блоков будет много и они будут всегда разные. Подозреваю что надо заменить команду "siblings" на какую-то другую, но так и не понял на какую. |
Avel Mink,
1. Элемент <a class="hidebtn" идёт певым в ячейке (или могут и до него быть) в данной td элементы ? 2. Элемент <div class="hideCont" всегда в иной ячейке, чем <a class="hidebtn" ? (Или они могут быть и в одной ? 3. Я так понимаю что ищем в табле следущий ближайший к "hidebtn" - class="hideCont" ? |
1. элемент <a class="hidebtn" href="javascript://" title="Скрыть блок">Показать</a>
идёт первым в ячейке (текст не в счёт 2. ищем в табле ближайший элемент, ниже Кликнутого "hidebtn" - у которого: class="hideCont" 3. В табле с кликабельным элементом "hidebtn" - нет дочерних таблиц ( Табла родитель - может и быть <script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script> <table> <tr> <td> <div class="hideCont" style="display:none">sadas 0</div> </td> </tr> <tr> <td> <a class="hidebtn" href="javascript://" title="Скрыть блок">Показать</a> </td> </tr> <tr> <td> <div class="PsevDo-hideCont" style="display:none">sadas</div> </td> </tr> <tr> <td> <div class="hideCont" style="display:none">Бла бла бла текст</div> </td> </tr> </table> <script type="text/javascript"> $(document).ready(function(){ $("a.hidebtn").click( function(){ var tableTd = $(this).parents("table:first").find("td"); var start = tableTd.index($(this).parent("td")); var end = tableTd.length; var Td = tableTd.slice(start, end); var a = Td.find('div.hideCont').eq(0); a.slideToggle('normal'); if(a.length){ var z=$(this).text(); $(this).text($(this).attr("title")); $(this).attr("title",z) } return false; }); }); </script> |
ох, спасибо огромное, то что надо. Если не сложно - можно сделать чтобы при нажатии, текст ссылки менялся не на title, а на просто указанный html код. При свернутом состоянии - "подробнее + картинка", при развернутом - "свернуть + картинка".
|
Часовой пояс GMT +3, время: 03:06. |