Question

以下是代码： http://jsfiddle.net/t2nite/KCY8g/

我想要点击 SHOW 按钮下面的 HIDE/SHOW ALL 按钮，如果按一个按钮就会显示它的文字并隐藏其他文本。

我使用了这段代码，但只要我点击任何按钮上的show，就会显示并隐藏自己。

$(".show").click(function() {
   $(this).parent().find("p").show(200);
   $("p").not(this).hide(200);
});

帮助。

Answer 1

您的问题是，show函数中的this不是<p>它是按钮。

$(".show").click(function() {
    var $thisP = $(this).parent().find("p")
    $thisP.show(200);
    $("p").not($thisP).hide(200);
});

http://jsfiddle.net/KCY8g/11/

Answer 2

jsFiddle Demo

基本上你想隐藏除当前区域之外的所有'itsawrap p'区域。

$(".show").click(function() {
    var _p = $(this).parent().find('p');
    // maybe even do: $(this).closest('.itsawrap').find('p');
    // (if you ever think you'll wrap any of these things in other divs/etc

    _p.show(200);
    $('.itsawrap p').not(_p).hide();
});

Answer 3

将显示代码更改为：

$(".show").click(function() {
    var container = $(this).closest(".itsawrap");
    $(".itsawrap").not(container).find("p").hide(200);
    container.find("p").show(200);
});

此处的演示演示：http://jsfiddle.net/jfriend00/6ypRz/

这适用于容器级别，因此您可以对所需的容器进行操作。

Answer 4

喜欢这个吗？

$("#btn").click(function() {
    var oneshow = false;
    $(".para2, .para3, .para4").each(function() {
        if ($(this).is(":visible")) {
            oneshow = true;
        }
    });
    if (oneshow == true) {
        $(".para2, .para3, .para4").hide(200);
    } else {
        $(".para2, .para3, .para4").show(200);
    }
});

$(".hide").click(function() {
    $(this).parent().find("p").hide(200);
});

$(".show").click(function() {
    var p = $(this).parent().find("p");
    $(p).show(200);
    $(parent).not(p).hide(200);
});

Answer 5

问题出在this。

$(".show").click(function() {
    var p = $(this).parent().find("p");
    p.show(200);
    $("p").not(p).hide(200);
});

Answer 6

最简短的方法之一：

$(".show").click(function(e) {
    $("p").not($(this).parent().find("p").show(200)).hide(200);
});

jsfiddle

Answer 7

错误是父母“this”是按钮，所以$（“p”）。不是（this）.hide（200）;除了你的按钮之外所有的p都说，这仍然是所有p的。

$(".show").click(function() {
     var parent = $(this).parent();
     $(".itsawrap").not(parent).find('p').hide(200);
     parent.find('p').show(200);
});

http://jsfiddle.net/renekoch/KCY8g/17/

隐藏其他一切，但是

7 个答案: