Javascript 按下时如何更改切换按钮文本？

我想能够按下一个按钮，说隐藏，然后说显示，当用户点击按钮。在下面的代码中，切换部分起作用，但现在我需要隐藏文本，以便在内容隐藏后显示

我从以下位置获取切换代码：

---

由于您的问题被标记为jQuery，请使用jQuery：

<div class="ISHide"><a href="#" class="hideLink">Hide Products - </a></div>


$(".hideLink").on("click", function(){
    if($(this).text()=="Hide Products - ")
    {
        $(this).text("Show Products - ");
    } else {
        $(this).text("Hide Products - ");
    }
    $(".ISProductBody").toggle(); 

    return false;
});

---

示例：

将按钮代码更改为以下内容：

<div class="ISHide" onclick="toggle(this)"><a href="#" >Hide Products</a></div>

把你的脚本改成这样

<script type="text/javascript">
function toggle (t) {
if (t.childNodes[0].innerHTML == "Hide Products") {
    t.childNodes[0].innerHTML = "Show Products";
} else {
    t.childNodes[0].innerHTML = "Hide Products";
}
}
</script>

---

我的答案是对里克·考尔德答案的修改。我使用了为类似场景提供的代码，但在本例中，按钮内有HTML标记，字体图标。我想这可能会帮助一些人将解决方案应用到其他情况

我要做的唯一修改是更改.html的.text，并添加.addClass/.removeClass来更改按钮样式。CSS不包括在内，因为它在这里是微不足道的

以下是我使用的代码：

$(".expand-button .button").on("click", function(){
    if($(this).html()==" Watch Video <i class=\"fa fa-play\"></i> ")
    {
        $(this).html(" Hide Video <i class=\"fa fa-times\"></i> ");
        $(this).addClass("secondary");
    } else {
        $(this).html(" Watch Video <i class=\"fa fa-play\"></i> ");
        $(this).removeClass("secondary");
    }
    $(".expand-button-content").fadeToggle();
});

谢谢你，瑞克和OP

var button = document.querySelector(".button")
var text   = document.querySelector(".text")
var t
button.addEventListener("click",function(){


    if(text.textContent=="Like"){
        t = "Liked"
    }
    else{
        t="Like"
    }
    text.textContent=t;
})

这是一个Like按钮的示例，该按钮更改为Like。 方法非常简单，如果文本是Like，变量t设置为Like，反之亦然，然后t替换文本内容。 为我工作 干杯 ：D

TextBox.innerHTML=； ButtonId.onclick=函数{ 如果TextBox.innerHTML=={ TextBox.innerHTML=HI； } 否则{ TextBox.innerHTML=； } }

---

您的头标签中是否包含jQuery？如果是这样，你可以用一种更简单的方式来做。切换你的html是相当混乱的…我知道它是混乱的。制作此代码的人用make this hide text say show将其甩给了我。祝你好运可能是重复的，或者你可能已经显示了一些努力在此张贴按钮改变耶！但开关会关闭。我把原始代码放回原处：看看切换是否会重新打开——它确实打开了——但随后它会返回到不更改文本的状态。我想我还得把这件事弄得一团糟，但是文本确实变了，所以这是朝着正确方向迈出的一步！看看这是否对你更有效。我在回答中更改了密码。不，ul标签没有消失；这是一个链接，仍然会更改为显示/隐藏，这是一个好迹象：添加一些关于这个答案如何帮助OP解决当前问题的解释。对代码的解释将有助于获得更好的答案

var button = document.querySelector(".button")
var text   = document.querySelector(".text")
var t
button.addEventListener("click",function(){


    if(text.textContent=="Like"){
        t = "Liked"
    }
    else{
        t="Like"
    }
    text.textContent=t;
})