如何更改按钮内的文字？

Question

我有一个使用引导一个网站，并与KendoUI创建一个数据网格，每行包含以下形式的按钮...

<button type="button" id="requestbtn1" class="btn btn-success">Request</button> 

我迷上了这些按钮的点击事件具有以下JavaScript ...

$("button[id^='requestbtn']").click(function() { 
    var lgid = String(this.id).replace("requestbtn", ""); 
    alert("Request for slip " + lgid); 
    this.html("Done"); 
    this.addClass("btn-primary"); 
    this.removeClass("btn-success"); 
}); 

的代码调用，警报显示正确的号码，但我试图改变按钮的文本为“完成”和CSS类为“BTN-小学”，以提醒用户他们已经提出了这个要求。

最后三行中没有一行可用。我原本他们都在一条线，像这样...

this.html("Done").addClass("btn-primary").removeClass("btn-success"); 

...但分裂他们，看看是否有独立的工作。

任何人有任何想法如何我可以改变文本和CSS类？

Answer 1

使用此

$("button[id^='requestbtn']").click(function() { 
    var lgid = String(this.id).replace("requestbtn", ""); 
    alert("Request for slip " + lgid); 
    var $this = $(this); 
    Sthis.html("Done"); 
    Sthis.addClass("btn-primary"); 
    Sthis.removeClass("btn-success"); 
}); 

Answer 2

您试图在原生DOM节点（this）上调用jQuery方法（html(),addClass()，removeClass()等）;无法访问这些方法。如果您使用jQuery，请记住使用jQuery。或者，至少要记住您是使用DOM还是使用jQuery。

尝试：

$("button[id^='requestbtn']").click(function() { 
    var lgid = String(this.id).replace("requestbtn", ""); 
    alert("Request for slip " + lgid); 
    $(this).html("Done").addClass("btn-primary").removeClass("btn-success"); 
}); 

或者，使用原生DOM选择：

$("button[id^='requestbtn']").click(function() { 
    var lgid = String(this.id).replace("requestbtn", ""); 
    alert("Request for slip " + lgid); 
    this.innerHTML = 'Done'; 
    this.classList.add('btn-primary'); 
    this.classList.remove('btn-success'); 
});