如何修复在尝试使用innerHTML时禁用按钮的问题

Question

我正在尝试使用内部HTML JS创建博客，这样当单击按钮时，其余内容就会显示给用户。我试着用这个代码使它工作，代码就像它在其他项目中一样，但由于某种原因，它禁用了按钮，它不起作用。任何帮助都将不胜感激。

这是我的代码(我确信我已经正确地导入了每个相应的文件，因为我在故障时做了这件事(

var secret = document.getElementById("secret");
var readMore = document.getElementById("sth");
readMore.addEventListener("click", shareSecret);
function shareSecret() {
secret.innerHTML =
"The truth? There is no secret to happiness. We are all doomed to die a miserable death and live a life with depression before doing so. If anyone knows how to be happy, it sure isn't me.";
}

<div class="morecontent">
<p id="secret">
Click the button below to see the secret...
</p>
</div>
<button id="sth">Read More</button>

Answer 1

在shareSecret((函数中添加readMore.disabled=true;。

编辑：如果添加readMore.style.display = 'none';后按钮在未来没有用处，则最好不显示

var secret = document.getElementById("secret");
var readMore = document.getElementById("sth");
readMore.addEventListener("click", shareSecret);
function shareSecret() {
secret.innerHTML ="The truth? There is no secret to happiness. We are all doomed to die a miserable death and live a life with depression before doing so. If anyone knows how to be happy, it sure isn't me.";
readMore.disabled=true;
}

<div class="morecontent">
<p id="secret">
Click the button below to see the secret...
</p>
</div>
<button id="sth">Read More</button>

Answer 2

代码段中的代码是正确的。如果它在你的项目中不起作用，检查语法，你可以省略一些字母或类似的东西。如果按钮禁用，则添加：

readmore.removeAttribute("disabled");