JavaScript的按钮返回错误警报

我申请一个工作，他们扔了一个JS问题详述如下：JavaScript的按钮返回错误警报

写一个函数来渲染页面上10个<button>元素，通过10编号为1，并提醒数点击时所选按钮的位置。做不是使用jQuery或任何其他库。

看起来很简单。我已经构建了一个工作模型，但它警告错误的数字。它会提醒按钮11所有的按钮。我知道我忘记了一件简单的事情。下面是我的代码（如果你有更好的组织方式，可以随意批评它）。此外，这里是一个链接到一个JSFiddle除了警报工作。

var count = 1; 

function createBtn(){ 
    var button = document.createElement("button"); 
    button.innerHTML = "Button " + count; 
    var body = document.getElementsByTagName("body")[0]; 
    body.appendChild(button); 
    button.addEventListener ("click", function() { 
    alert('Button ' + count); 
    }); 
} 

function buttonRender(){ 
    for(var i = 0; i < 10; i++){ 
    createBtn(); 
    count++; 
    } 
} 

buttonRender();

来源

2016-09-27 Alex Marple

您应该将计数传递给函数。

function createBtn(count){ 
    var button = document.createElement("button"); 
    button.innerHTML = "Button " + count; 
    var body = document.getElementsByTagName("body")[0]; 
    body.appendChild(button); 
    button.addEventListener ("click", function() { 
    alert('Button ' + count); 
    }); 
} 

function buttonRender(){ 
    for(var i = 0; i < 10; i++){ 
    createBtn(count); 
    count++; 
    } 
}

https://jsfiddle.net/xw7mhag2/

来源

2016-09-27 21:01:56

啊！我知道这很简单。我会在Stack Overflow允许我在10分钟内做出答案。谢谢Alberto！ –

如果解释_why_count为所有按钮的11，即使它在创建按钮时具有正确的值，此答案将会非常棒！ –

var count = 0; 

    function createBtn(count){ 
    var button = document.createElement("button"); 
    button.innerHTML = "Button " + count; 
    var body = document.getElementsByTagName("body")[0]; 
    body.appendChild(button); 
    button.addEventListener ("click", function() { 
     alert("Button " + count); 
    }); 
    } 

    function buttonRender(){ 
    for(var i = 0; i < 10; i++){ 
    count++; 
     createBtn(count); 

    } 
    } 

    buttonRender();

来源

2016-09-27 21:16:16 ashwin

JavaScript的按钮返回错误警报

回答

相关问题