Question

我有一些按钮，每个按钮都有一个特定的类，以区别于其他类似的按钮。类名遵循格式moreid，其中id随按钮更改。我使用以下代码来更改按钮文本：

function changeText(btn){
  $('.'+btn).text(function(i, text){
    return text === "Show More" ? "Show Less" : "Show More";}
)}

我使用changeText(moreid)调用此函数。使用此代码，我收到错误：

Error: Syntax error, unrecognized expression: .[object HTMLDivElement]

这是按钮的HTML

<button type="button" 
        class="btn btn-primary btn-lg moreapple" 
        data-toggle="collapse" 
        data-target="#moreapple" 
        onclick="changeText(moreapple)">Show More</button>

从一个按钮到另一个按钮的唯一变化就是更多的东西等等。

如何更改此功能以更改按钮文字？

Answer 1

您的changeText(btn)告诉您，您正在传递btn作为参数，因此您可能需要尝试一下

$(btn).text(function(i, text){
    return text === "Show More" ? "Show Less" : "Show More";
});

除非您有特殊要求，否则您的标记应该是这样的

<button type="button" 
        class="btn btn-primary btn-lg moreapple" 
        data-toggle="collapse" 
        data-target="#moreapple" 
        onclick="changeText(this)">Show More</button>

使用$(btn)来自调用函数 changeText()

Fiddle Example

Answer 2

显然，根据您的命名惯例，您的ID会有所不同 Duplicate Question Answer

var status = "less";

function toggleText()
{
    var text="Here is some text that I want added to the HTML file";

    if (status == "less") {
        document.getElementById("textArea").innerHTML=text;
        document.getElementById("toggleButton").innerText = "See Less";
        status = "more";
    } else if (status == "more") {
        document.getElementById("textArea").innerHTML = "";
        document.getElementById("toggleButton").innerText = "See More";
        status = "less"
    }
}

Answer 3

您需要从

更新标记

<button type="button" 
        class="btn btn-primary btn-lg moreapple" 
        data-toggle="collapse" 
        data-target="#moreapple" 
        onclick="changeText(moreapple)">Show More</button>

到

<button type="button" 
        class="btn btn-primary btn-lg moreapple" 
        data-toggle="collapse" 
        data-target="#moreapple" 
        onclick="changeText('moreapple')">Show More</button> <!-- Pass moreapple as string -->

在jQuery或JavaScript中更改按钮的文本

3 个答案: