如何使用Javascript和JQuery修改位于引导模式中的按钮的外观？

我有一个网页，利用引导模式向用户显示信息，其中一个模式中有一个按钮，用户可以选择某些功能

在我的网页中，有一个函数可以向外部API发出post请求，该API返回一组数据。此数据中有一个标志

externalProvider

，当此标志设置为1时，我希望更改按钮的文本和链接。因此，按钮现在具有不同的行为。如果未设置

externalProvider

标志，则按钮的行为和外观保持不变

该按钮位于引导模式中，代码如下所示

HTML

---

如您所说，如果您正在使用jQuery-

function openTask(taskId) {
    $.post(http://localhost:1000/endpoint/, function (data) {

        if (data !== "Failed") {
            if (data.externalProvider === 1) {
                //Change button design here
                $('div.modal-footer button', '#EditTask').text([...your desired text...]);
            } else {
                //Keep button design the same
            }

        } else {
            alert("An error occured");
        }
    });

    $('#EditTask').modal('toggle');
}

---

您可以通过使用JQuery的removeClass删除类“btn”和“btn success”来删除引导应用的CSS样式，然后使用addClass函数应用您想要的任何CSS样式：

$(".action-complete-task").removeClass("btn btn-success").addClass("newCSSStlying");

编辑：

通过删除它之前拥有的类，看起来会很满，所以最好添加一个类来覆盖css

---

我想说：

$（.action complete task”）.addClass（“newCSSStlying”）
我建议为按钮添加一个id，以确保您只针对要更新的按钮。然后，您可以使用下面的更改注释来更新按钮文本

$("#YOUR-ID").html('NEW TEXT');

比如说

HTML

需要明确的是，在ajax帖子返回之前会显示模式对话框，对吗？你对设计的改变有什么看法？@Forty3是的，首先呈现和显示模式，发出POST请求，然后在帖子返回后使用数据填充模式。我不建议无故删除类，只需添加一个覆盖旧css的类，就可以减少工作量。这是公平的。只要确保所有需要调整的样式都是新样式。我能在按钮上添加一个ID并以这种方式引用它吗？我简化了用于堆栈的HTML，实际上模式包含许多按钮@杰森的回答非常正确。谢谢阿里，他仍然在努力应对降价：）
$(".action-complete-task").removeClass("btn btn-success").addClass("newCSSStlying");

$("#YOUR-ID").html('NEW TEXT');

<button id="action-complete-task" type="button" class="btn btn-success action-complete-task">The button who's text I want to change</button>

$("#action-complete-task").html('NEW TEXT');