動態更改文本，如何不刪除

Question

我有這個按鈕：

<button disabled="" id="btnGuardarPaso1" class="btn btn-primary" type="submit"><i class="fa fa-save"></i> Save</button>

然后通過jQuery，我基於對select元素的用戶選擇來動態更改文本。 看代碼：

if (tipoTramiteSolVal != 1 && tipoTramiteSolVal !== "" && tipoTramiteSolVal != undefined ) {
    $("#btnGuardarPaso1").removeClass("btn-primary").text("Edit");
} else {
    $("#btnGuardarPaso1").addClass("btn-primary").text("Save");
}

但是，這段代碼有一個問題： <i class="fa fa-save"></i>元素也已刪除/更改，我希望對其進行維護。 我該如何解決？

另外，由於按鈕具有FontAwesome圖標，我也可以動態更改它嗎？ 例如， fa-save將根據用戶的選擇而更改為fa-edit ，反之亦然

Answer 1

您可以將span標簽放置在按鈕內部，並設置span而不是按鈕的文本。 斜體將不在范圍內。

<button disabled="" id="btnGuardarPaso1" class="btn btn-primary" type="submit"><i class="fa fa-save"><span id="textItem"></span></i> Save</button>


if (tipoTramiteSolVal != 1 && tipoTramiteSolVal !== "" && tipoTramiteSolVal != undefined ) {
$("#btnGuardarPaso1").removeClass("btn-primary");
$("#textItem").text("Edit");
} else {
$("#btnGuardarPaso1").addClass("btn-primary");
$("#textItem").text("Save");
}

[edit]同樣，如果您使用jQuery查找斜體標簽（直接通過ID或通過遍歷DOM），則可以肯定使用以下方法設置類：

 $(this).attr('class','classname');