动态创建按钮的 onclick 函数中的变量

Question

嗨，

基本上，我有许多动态生成的列表项，其中有一个按钮。当我将列表项添加到 ul 列表之前时，我可以访问一个变量，当我单击列表项中的按钮时，我想传递该变量。但是当我在下面显示的代码行中添加变量时，它给了我一个 Uncaught ReferenceError: challenger is not defined 错误。我怎样才能传递这些变量？

JAVASCRIPT:

window.GLOBAL_socket.on('challenged', function(data) {
    console.log("You have been challenged by the player " + data.challenger);
    var challenged = getUrlVars()['user'];
    var challenger = data.challenger;
    $("#challengesList").prepend("<li><div id='newChallenge'><p id='challenge_header'>You have been challenged by: </p><p id='challenge_challenger'>" + data.challenger + 
        "</p><input type='button' value='ACCEPT' id='challenge_accept' onclick='acceptChallenge(challenger)'></input><input type='button' value='DECLINE' " + 
        "id='challenge_decline' onclick='declineChallenge(this)'></div></li>");
});

在第6行找到onclick方法

感谢您的回复，

芝诺

Answer 1

之所以没有定义challenger，是因为它是一个局部变量，当你实际点击触发函数时，无法全局访问。

所以不要使用变量，只需将它的实际值放在 onclick 中即可。

将您的代码更改为：

$("#challengesList").prepend("<li><div id='newChallenge'><p id='challenge_header'>You have been challenged by: </p><p id='challenge_challenger'>" + data.challenger + 
        "</p><input type='button' value='ACCEPT' id='challenge_accept' onclick='acceptChallenge(\""+challenger+"\")'></input><input type='button' value='DECLINE' " + 
        "id='challenge_decline' onclick='declineChallenge(this)'></div></li>");

Answer 2

按照我在评论中提到的更改代码。

var challenged = [];
var challenger = [];
var counter = 0;

window.GLOBAL_socket.on('challenged', function(data) {
    console.log("You have been challenged by the player " + data.challenger);
    counter++;
    challenged[counter] = getUrlVars()['user'];
    challenger[counter] = data.challenger;

    $("#challengesList").prepend("<li><div id='newChallenge'><p id='challenge_header'>You have been challenged by: </p><p id='challenge_challenger'>" 
        + data.challenger 
        + "</p><input type='button' value='ACCEPT' id='challenge_accept'"

        // change of code --> passing value directly into the function
        + " onclick='acceptChallenge(challenger["+counter+"]

        +")'></input><input type='button' value='DECLINE' " 
        + "id='challenge_decline' onclick='declineChallenge(this)'></div></li>");

});

我刚刚修改了代码，希望它对你有用。让我知道

动态创建按钮的 onclick 函数中的变量

variable in onclick function of dynamically created button

javascript

variables

jquery

dynamic

button