Question

我正在努力选择一个完全用HTML和Javascript编写的冒险游戏;我想完全用Javascript创建我的大部分元素来创建一个很棒的动态游戏！我在使用事件和事件监听器时遇到问题。这是一个神秘的游戏;玩家从列表中选择角色后，可以邀请五位嘉宾参加派对。其中一位客人被杀，让你用三名嫌疑人解开谜团。

在您选择了播放器后，还有另一个按钮，上面写着“选择此角色！”。单击此按钮时，应该隐藏播放器创建UI，并且可以看到新的UI。使用现在的代码，完全跳过“StartGame”功能。我究竟做错了什么？你能给予的任何帮助都会非常棒，非常感谢！

btnPlayer = document.createElement('button');
btnPlayer.id = 'BTN_btnPlayer';
btnPlayer.type = 'button';
btnPlayer.addEventListener('click', welcomePlayer(), true);
btnPlayer.onclick = welcomePlayer();
btnPlayer.innerHTML = 'Select This Character!';
myDiv.appendChild(btnPlayer);

修改我修改了我的按钮事件属性，如下所示：

btnPlayer.addEventListener('click', welcomePlayer, true);
//btnPlayer.onclick = welcomePlayer;

有人评论说因为两者都没有奏效。我也尝试清除缓存。这是我的StartGame（）函数，不包括按钮代码。我不会在我的下拉列表中包含用于创建选项的“charFirstNames []”和“charLastNames []”。我把它们分开以便讲述一个更有趣的故事;当我得到错误和基础知识时，它们最终将成为数据库记录。我不认为我搞砸了这里的任何事情，但我有可能做到了吗？该函数由编码到HTML中的唯一按钮调用。

function startGame(divName) {
myDiv = document.getElementById('story');

lblPlayer = document.createElement('label');
lblPlayer.id = 'LBL_Player';
lblPlayer.htmlFor = 'DDL_PlayerChar';
lblPlayer.innerHTML = 'Please select a character. ';
myDiv.appendChild(lblPlayer);

ddlPlayer = document.createElement('select');
ddlPlayer.id = 'DDL_PlayerChar';
myDiv.appendChild(ddlPlayer);

defOpt = document.createElement("option");
defOpt.value = 0;
defOpt.text = 'Select...';
ddlPlayer.appendChild(defOpt);

//Create and append the options
for (var i = 0; i < charFirstNames.length; i++) {
    var option = document.createElement("option");
    option.value = charFirstNames[i]+'_'+charLastNames[i];
    option.text = charFirstNames[i]+' '+charLastNames[i];
    ddlPlayer.appendChild(option);
}

document.getElementById('BTN_Start').hidden = true;

}

welcomePlayer（）函数类似于startgame（）函数，创建用于邀请第一个“guest”并删除播放器创建UI的界面。

Answer 1

这两行都将onclick处理程序设置为调用welcomePlayer函数的结果（参见parens？）。

btnPlayer.addEventListener('click', welcomePlayer(), true);
btnPlayer.onclick = welcomePlayer();

你可能意味着

btnPlayer.addEventListener('click', welcomePlayer, true);

在Javascript中创建和调用事件

1 个答案: