了解 .toggle 函数和隐藏/取消隐藏按钮

Question

>我有一个文本输入区域，可以将字符串切成一个数组，并为每个单词制作按钮。我希望能够在按钮上("单击")上隐藏每个单词。我尝试使用Jquery.toggle函数，但这只会隐藏我所有的按钮。我不能让他们重新出现。有没有办法淡出它们并使它们隐藏并能够取消隐藏它们。

我已经尝试过搜索互联网。无法真正找到解决方案，实际上考虑编写自己的切换，但这似乎不对劲。是您可以使用切换来实际拥有可单击的静态按钮的唯一方法，该按钮可隐藏或取消隐藏一段代码。

在没有显示/隐藏所有按钮的情况下，能够取消隐藏隐藏某些内容显然有点奇怪。

let createText=$('<textarea/>', {
'id':'Text',
'placeholder':'Text',
'class':'form-control col col-md-5',
'rows':'10'
}).on("input", function() {
let woorden = $(this).val().split(/(s)/g);
$('#outputButtons').empty();
for (let i = 0; i < woorden.length; i++) {
if (woorden[i].replace(/s/g, "") != "") {
let outputBtn=$('<button/>', {
'class': 'btn btn-secondary mt-2 mr-2'
}).html(woorden[i])
$('#outputButtons').append(outputBtn);                        
}
}
});
let outputButtons = $('<div/>', {
'class':'col',
'id':'outputButtons'
}).on('click', function() {
$('#outputButtons').toggle(1000); 
});

我将如何继续，实际上隐藏/取消隐藏彼此分开的按钮。如果没有显示/隐藏所有内容的静态按钮，这是否可能？

提前感谢您的阅读，我是一名新程序员，您必须同时记住很多信息和事情，这使它不时令人困惑。很抱歉，如果这篇文章令人困惑。

Answer 1

您可以在代码中尝试此操作：

编写下面的 css 类：

.hide{
opacity: 0;
}

然后应用于输出按钮("点击"功能)：

$(this).toggleClass("hide")

Answer 2

您不需要使用按钮切换！

将此类添加到要禁用的按钮

.disable{
cursor: not-allowed;
pointer-events: none;
}

要更改状态，您可以使用jquery

$("#id").toggleClass('disable');