按钮函数不是用 htmlstring 定义的

Question

我能够显示包括按钮在内的所有详细信息。但是，主要问题是当我单击按钮时，没有任何反应。它说当我检查错误时没有定义 BtnRemoveAdmin((。但是，我有函数BtnRemoveAdmin((？？我试图将函数移动到 htmlstring。什么都没用。我不确定出了什么问题。

(function () {
$(document).ready(function () {
showadmin();
});
function showadmin() {
var url = serverURL() + "/showadmin.php";
var userid = "userid";
var employeename = "employeename";
var role ="role";
var JSONObject = {
"userid": userid,
"employeename": employeename,
"role": role,
};
$.ajax({
url: url,
type: 'GET',
data: JSONObject,
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function (arr) {
_getAdminResult(arr);
},
error: function () {
alert("fail");
}
});
}
function _getAdminResult(arr) {
for (var i = 0; i < arr.length; i++) {
htmlstring = '<div class="grid-container">' +
'<div>' + arr[i].userid + '</div>' +
'<div>' + arr[i].employeename + '</div>' +
'<div>' + arr[i].role + '</div>' +
'<div>' + '<button onclick="BtnRemoveAdmin()">Remove</button>' + // 'BtnRemoveAdmin' is not defined
'</div>' ;
$("#name").append(htmlstring);
}   
function BtnRemoveAdmin() {
var data = event.data;
removeadmin(data.id);
} 
}

function removeadmin(userid) {
window.location = "removeadmin.php?userid=" + userid;
}

})();

Answer 1

您的所有代码都在 IIFE 中定义。

这包括BtnRemoveAdmin.

当您将 JavaScript 生成为字符串时，它会在不同的范围内进行规避。

BtnRemoveAdmin在该范围内不存在。

---

不要通过将字符串混合在一起来生成 HTML。

请改用 DOM。

function _getAdminResult(arr) {
var gridcontainers = [];
for (var i = 0; i < arr.length; i++) {
var gridcontainer = $("<div />").addClass("grid-container");
gridcontainer.append($("<div />").text(arr[i].userid));
gridcontainer.append($("<div />").text(arr[i].employeename));
gridcontainer.append($("<div />").text(arr[i].role));
gridcontainer.append($("<div />").append(
$("<button />")
.on("click", BtnRemoveAdmin)
.text("Remove")
));
gridcontainers.push(gridcontainer);
}
$("#name").append(gridcontainers);
}   

Answer 2

我使用JQuery，有时我会遇到同样的问题，因为普通的JS函数没有被调用。

所以我创建了 JQuery 函数：

$.fn.extend({
btnRemoveAdmin: function() {
...//Do what you want here
}
});

要调用它，请使用：

<button onclick="$().btnRemoveAdmin();"></button>

希望对您有所帮助！