在Javascript中创建和调用事件

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);