Jquery 隐藏并显示按钮上的元素单击w/.Hide（）？

我一直在试图找到如何使用jQuery隐藏和显示一组段落。我想找到一种方法，使用相同的按钮，并使用.hide和.show。我不知道这是可能的还是“正确的”，但我对javascript比较陌生，我正在尝试自学

这是一把小提琴，展示了我迄今为止所做的工作：

我的问题是，我可以让它隐藏，但我无法让按钮在第二次单击时显示元素

$(document).ready(function () {
var btn = 1;
var advancebtn = function () {
    btn++;
};

var reducebtn = function () {
    btn--;
};

if (btn >= 1) {
    $("button").click(function () {
        reducebtn();
        $("p").hide();
    });
} else {
    $("button").click(function () {
        advancebtn();
        $("p").show();
    });
}
});

问题是，您从未运行过第二次单击事件处理程序。代码在PageReady上运行，如果btn>=1{则if语句不会转到else

请尝试以下方法：

$("button").click(function () {
    $("p").toggle();
});

演示 或者，将if语句放入click处理程序中：

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

Demo问题是，您从未运行过第二次单击事件处理程序。您的代码在PageReady上运行，如果btn>=1{则if语句不会转到else

请尝试以下方法：

$("button").click(function () {
    $("p").toggle();
});

演示 或者，将if语句放入click处理程序中：

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

---

Demo将if/else放在click事件中，否则只连接隐藏处理程序

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

---

将if/else放在click事件中，否则只连接隐藏处理程序

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

---

如果您只想显示/隐藏，请尝试

$("button").click(function() {
   $("p").toggle(); 
});

您还可以使用$p.toggleslow；或$p.togglefast

通过使用show；和hide；以及我认为您要实现的逻辑，使用您的特定示例：

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

---

如果您只想显示/隐藏，请尝试

$("button").click(function() {
   $("p").toggle(); 
});

您还可以使用$p.toggleslow；或$p.togglefast

通过使用show；和hide；以及我认为您要实现的逻辑，使用您的特定示例：

$("button").click(function () {
    if (btn >= 1) {
        reducebtn();
        $("p").hide();
    } else {
        advancebtn();
        $("p").show();
    }
});

---

切换是你想要的，但是你的事件处理是由内而外的。我已经学会了如何使用切换，但我想知道是否有任何方法可以使用show和hideToggle，这是你想要的，但是你的事件处理是由内而外的。我已经学会了如何使用切换，但我想知道是否有任何方法可以使用show和HideTocks来完成这项工作。对于解释来说，有很多谢谢你的解释