1

问题：当我点击表格时，我不希望它切换。只有当我单击按钮（div）时。此外，必须有一个选择器，以便其他 li 的表不会切换。

jQuery

$(document).ready(function() {
    $('table.edititem').hide();
    $('.menu-category > li ul li .button').click(function(){
        $('table.edititem', this).toggle();
    });
});

我知道问题是： $('table.edititem', >>>this<<<).toggle(); 因为表格不在“.button”里面。我们需要抓住父母，但我们该怎么做呢？

HTML

<ul>
<li>
    Category1
    <ul>
        <li>
            <div>
                <div class="button"></div>
                <table class="edititem">
                </table>
            </div>
        </li>
    </ul>
</li>
</ul>

我希望你明白我的意思。

4

2 回答 2

3

您可以使用 .parent() 函数向上一个节点，然后搜索相关表。

$(document).ready(function() {
    $('table.edititem').hide();
    $('.menu-category > li ul li .button').click(function(){
        $(this).parent().find("table.edititem").toggle();
    });
});
于 2013-05-22T16:31:00.370 回答
0

You need to correct your html table(put tr,td). Try this :

HTML

<ul class="menu-category">
<li>
    Category1
    <ul>
        <li>
            <div>
                <div class="button">dddd</div>
                <table class="edititem"><tr><td>dfdf</td></tr>
                </table>
            </div>
        </li>
    </ul>
</li>
</ul>

jQuery

$(document).ready(function() {
    $('table.edititem').hide();
    $('.menu-category > li ul li .button').click(function(){
         console.log($(this).siblings('table.edititem'));
        $(this).siblings('table').toggle(100);
    });
});

Here is the working demo : http://jsfiddle.net/JgfMv/

于 2013-05-22T16:45:06.247 回答