在 jQuery 中更改按钮文本

Question

我有一个表格，我想通过单击按钮来隐藏或显示它。此外，当单击按钮时，应适当更改其文本。我有以下代码，但按钮的文本没有被更改：

<script>
        $(document).ready(function () {
            $("#myButton").click(function () {
                $(".myTable").toggle(1000, "linear", function changeButtonText() {
                    $("#myButton").text = ($("#myButton").text === "Hide table" ? "Show table" : "Hide table");
                });
            });
        });
</script>

... 

<input type="button" id="myButton" value="Hide table" />
<table class="myTable">
    ...
</table>

Answer 1

您没有以正确的方式使用该功能：

• 如果元素是按钮：

错误：

$("#myButton").text = ("new text");

工作：

$("#myButton").text("new text");

工作示例：

$("#myButton").text = ("new text");

$("#myButton").text("new text");

• 如果元素是input type="button"：

错误：

$("#myButton").text = ("new text");

工作：

$("#myButton").val("new text");

工作示例：

$("#myButton").text("New text");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button type="button" id="myButton">Old text</button>

Answer 2

尝试这个：

$("#myButton").val($("#myButton").val() === "Hide table" ? "Show table" : "Hide table");