Question

为了好玩，我正在尝试用javascript制作一个小游戏，我对编程很新，所以这更像是对我能做什么的考验。

我在按下按钮时会出现以下功能，这样可以正确显示新按钮但按下此新按钮时不会重新调整其下方的功能

function clickAttack(){
    if(heroHealth >= 0 && monsterHealth >= 0){

另一个功能看起来像这个

ReferenceError: clickAttack is not defined

此功能在关闭第一个功能后就可以了。

控制台为我提供了以下内容

{{1}}

我不知道如何解决这个问题。

帮助将受到欢迎

Answer 1

这是不使用onxyz - 属性样式事件处理程序的众多原因之一：它们要求您在其中使用的任何函数都是 globals 。 Globals是Bad Things™。你的功能显然不是全局的，这是一件好事。

另外，document.write在2016年（或2006年）的网站开发中基本没有位置。相反，使用DOM。在您的情况下这样做的一个好处是，它意味着clickAttack不再必须是全局的：

function clickStart() {
   var input = document.createElement("input");
   input.type = "button";
   input.value = "attack!";
   input.addEventListener("click", clickAttack, false);
   document.body.appendChild(input);
}

Answer 2

或者你可以像这样使用jquery。

$(document).ready(function(){
    $('body').on('click', '.myButton' , clickAttack);                   
});


function clickStart(){
        $( "body" ).append( $( "<input type='button' value='attack!' class='myButton'/>"));
        }
function clickAttack(){
        alert("hello");
        }



<input type='button' value='add!' onClick='clickStart();' />

Answer 3

您好我建议您使用jQuery库。代码对你来说很简单。

我的解决方案是here in jsFiddle

我使用了自我invoke function，其中init函数注册event listener .on()点击此呼叫攻击函数

如果您有任何问题，请随时与我联系。

js代码：

(function(){
    'use strict';

  function attack() {
    $('#logger').append('Attacked!<br>');
  };

  function init() {
        $('#attackBtn').on('click', function() {
        attack();
    });
  };

  init();
})();

Javascript文档写入按钮内部功能使用的其他功能不起作用

3 个答案: