修复HTML标题和按钮标记不更新文本的问题

Question

我正在尝试编写一些代码来更新头标记和按钮标记。但是，当我使用方法.text();时，它不起作用。所以我通过其他堆栈溢出问题找到了正确的方法，我看到了基本相同的东西。每个人都告诉我使用.text()或.html()。所以我真的很困惑为什么它不起作用。我不确定它是否与标记中已经存在的值有关。

HTML:

<div class="contents">
<div class="card text-center myCard">
<div class="card-header"></div>
<div class="card-body">
<h5 class="card-title"></h5>
<p class="card-text"></p>
<button type="button" class="btn btn-primary ttBtn"></button>
</div>
<div class="card-footer text-muted"></div>
</div>
</div>

jQuery:

$(".eBtn").on(
"click",
function(event) {

event.preventDefault();
var href = $(this).attr('href');
console.log(href);
$.get(href, function(ary2, status) {
$("#displayAppName").val(ary2.appname);
$("#appcode").val(ary2.appcode);
$("#editStatus").val(ary2.status);


if (ary2.mapstatus == "" || ary2.mapstatus == null) {
mapBool = true;
$("#mapStatus").val("");
$("#createBtn").val('Create');
$('#modalCreateBtn').attr(
'href',
'/create?currentAppcode='
+ ary2.appcode
+ "&currentAcro="
+ ary2.acronym
+ "&currentAppname="
+ ary2.appname);




console.log("Card Create: " + $(".card-title").val());

} else {
$("#mapStatus").val("Mapped");
$("#createBtn").val('Edit');
$('#modalCreateBtn').attr(
'href',
'/edit?currentAppcode='
+ ary2.appcode
+ "&currentAcro="
+ ary2.acronym);
mapBool = true;

console.log("Card Edit: " + $(".card-title").val());

}
});
console.log("Main Boolean : "  + this.mapBool)
console.log("Main Boolean : "  + mapBool)
if(mapBool){
$(".card-title").text("Application Mapped!");
$(".card-text").text("Continue to view application");
$(".ttBtn").text("New Mapping after");
}
$("#exampleModal").modal();

});

jQuery更改HTML:

$(".card-title").text("Application Mapped!");
$(".card-text").text("Continue to view application");
$(".ttBtn").text("Continue");

Answer 1

已创建变量ary2。希望这对你有所帮助。

var ary2 = [];
if (ary2.mapstatus == "" || ary2.mapstatus == null) {
$("#mapStatus").val("");
$("#createBtn").val('Create');
$('#modalCreateBtn').attr(
'href',
'/create?currentAppcode=' +
ary2.code +
"&currentAcro=" +
ary2.acro +
"&currentAppname=" +
ary2.name);
$(".card-title").text("Application Mapped!");
$(".card-text").text("Continue to view application");
$(".ttBtn").html("Continue");
} else {
$("#mapStatus").val("Mapped");
$("#createBtn").val('Edit');
$('#modalCreateBtn').attr(
'href',
'/edit?currentAppcode=' +
ary2.code +
"&currentAcro=" +
ary2.acro);
}
$(document).ready(function() {
$(".card-title").text("Application Mapped!");
$(".card-text").text("Continue to view application");
$(".ttBtn").html("Continue");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="contents">
<div class="card text-center myCard">
<div class="card-header"></div>
<div class="card-body">
<h5 class="card-title">Application not mapped!</h5>
<p class="card-text">Click the "New Tier" button to begin mapping.
</p>
<button type="button" class="btn btn-primary ttBtn">New
Mapping</button>
</div>
<div class="card-footer text-muted"></div>
</div>
</div>