скрытие внутренних таблиц с помощью JQuery - PullRequest
Новая
       2

скрытие внутренних таблиц с помощью JQuery

0 голосов
/ 07 февраля 2011

Я пытаюсь скрыть внутреннюю таблицу с помощью JQuery, где элемент, который вызывает скрытие, находится в родительской таблице. Вот мой код: 

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function() {
    $(".collapsible").click(function(event) {

        event.preventDefault();

        inner = $(this).find(".inner");



        if($(inner).is(":visible") == true) {

            alert("hiding");

            $(inner).hide("slow");

        }

        else {

            alert("showing");

            $(inner).show("slow");

        }

    });

    $(".inner").each(function(index, element) {

        $(this).hide(0);

    });
});
</script>

<table class='outer'>
<tr><td><a class='collapsible' href='#'>click here</a></td></tr>
<tr><table class='inner'>
<tr><td>thing</td></tr><tr><td>another thing</td></tr>
</table>
</table>
<table class='outer'>
<tr><td><a class='collapsible' href='#'>click here</a></td></tr>
<tr><table class='inner'>
<tr><td>something else</td></tr><tr><td>another something else</td></tr>
</table>
</table>
</body>
</html>

Кто-нибудь знает, почему нажатие на «щелкнуть здесь» не приводит к отображению внутренней таблицы? Заранее спасибо

1 Ответ

0 голосов
/ 07 февраля 2011

Потому что .find() ищет внутри якоря .collapsible. Сначала необходимо перейти к родительской таблице, чтобы правильно использовать .find(): 

$(this).closest("table.outer").find("table.inner");

Весь ваш код может быть упрощен до: 

$(function() {
    $(".collapsible").click(function(event) {
        event.preventDefault();
        $(this).closest("table.outer").find("table.inner").toggle('slow');
    });

    $(".inner").hide();
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...