按钮功能未使用htmlstring定义

时间:2018-10-19 14:53:48

标签: javascript

我能够显示所有详细信息,包括按钮。但是,主要问题是单击按钮时什么也没发生。它说我检查错误时未定义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;
}


})();

2 个答案:

答案 0 :(得分:0)

所有代码都在IIFE中定义。

其中包括BtnRemoveAdmin

当您将JavaScript生成为字符串时,它会在其他范围内逃逸。

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); } 在该范围内不存在。


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

改为使用DOM。

<xsl:choose>
                <xsl:when test="@product='OPTION'">
                <fo:block-container keep-together.within-line="always"> 
                    <fo:block>  
                        <xsl:apply-templates select="*[contains(@class, ' topic/title ')]"/>
                    </fo:block>
                    <fo:block xsl:use-attribute-sets="title__option">   
                        <xsl:text>OPTION&#160;</xsl:text>
                            <xsl:text>&#160;</xsl:text>
                    </fo:block> 
                </fo:block-container>   
                </xsl:when>
            <xsl:otherwise>
                <xsl:apply-templates select="*[contains(@class, ' topic/title ')]"/>
            </xsl:otherwise>
        </xsl:choose>

答案 1 :(得分:-1)

我使用JQuery,有时我遇到相同的问题,没有调用普通的JS函数。

所以我创建了JQuery函数:

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

要调用它,请使用:

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

希望它对您有帮助!