更改按钮文字 [英] Change button text

问题描述

我在以下内容中找到了部分答案: jQuery更改按钮文字

I've found part of my answer on :jQuery change button text

更改单击时按钮的文本.我要搜索的是如何切换文本.我尝试使用class方法来切换显示团队"/隐藏团队"的文本.如果仅使用该属性，则可以更改单击按钮时的文本，但这不会将其更改回.

to change the text of a button on the click. What I'm searching for is how to toggle that text. I've tried using the class method to toggle the text of "show teams" / "hide teams". If I just use the property I can change the text on the button click but that will not change it back.

HTML

<input class="teams" type="button" value="Teams" />

js

    $(".teams").click(function () {
        $("#container2").toggle();
        //$("#teams").prop("value", "Hide Teams");

        var $this = $(this);
        if ($this.hasClass('teams')) {
            $this.text('Show Teams');
        } else {
            $this.text('Hide Teams');
        }
    });

推荐答案

input 元素没有文本内容

引用 jQuery文档

获取匹配元素集合中每个元素(包括其后代)的组合的文本内容.

---

使用 button 标记

<button class="teams">Teams</button>

或使用 .val()方法(适用于输入元素的 )代替 .text()

or use the .val() method (that applies to input elements) instead of the .text()

现在，由于您测试了 teams 类的存在，因此您还需要切换该

Now since you test for the existence of the teams class you will need to also toggle that

    var $this = $(this);
    if ($this.hasClass('teams')) {
        $this.text('Show Teams');
    } else {
        $this.text('Hide Teams');
    }
    $this.toggleClass('teams'); // add this line

这篇关于更改按钮文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！