Question

我需要从列表格式中单击的父元素中选择一个类。一直阻止具有相同类名的其他类显示。

所以，例如：

$('ul').click(function() {
    $('li').next(".info").css({ "display" : "block" });
});

我将.info设置为display:none;

我的HTML代码是：

<ul>
    <li><span>Guy</span></li>
    <li class="info">
        <p>This should pop up when I click on the "Guy" span.</p>
    </li>
</ul>

虽然，我似乎无法弄清楚为什么它不起作用/开火。

非常感谢任何帮助。

Answer 1

你基本上是针对错误的元素。只需使用：

$('ul li').click(
    function(){
        $(this).next('li.info').show();
    });

在原始代码$(this)中，点击了ul（click个事件从点击的li或span到{{{ 1}}），然后查找还的类名为ul的{{1}}的下一个兄弟。

我的修正案的工作原理是让ul事件的目标为info，其中获得了click类的兄弟元素。< / p>

顺便说一句，在jQuery无法正常工作的情况下，只需检查您的选择器是否匹配您认为应该匹配的内容，li会很有帮助。

Answer 2

您可以将事件绑定到 span 元素。

$(document).ready(function(){
    $('ul span').click(function() {
        // $('.info').hide()
        $(this).parent().next().show();
    });
})