添加JavaScript onclick功能

Question

我在onclick上遇到問題，當我不向函數發送參數時，參數總是發送給相同的函數（與最后一個參數相同）。我的錯誤是什么？

    var N = 5;
    var btns = [];
    for(var opt = 0 ; opt < N ; ++opt){ 
        var resp = "option #" + opt; 

        var options = document.createElement('input'); 
        options.setAttribute('type' , 'button'); 
        options.setAttribute('value' , resp); 
        options.addEventListener('click' , function(){ 
            doClick(resp);
        });

        btns.push(options);
    }
    var divMain = document.getElementById('mainDiv');
    for(var i = 0 ; i < btns.length ; ++i){
        divMain.appendChild(btns[i]); // add btns to main div
    }

Answer 1

您是否在代碼中聲明了body元素？

 var N = 5; var btns = []; for(var opt = 0 ; opt < N ; ++opt){ var resp = "option #" + opt; var options = document.createElement('input'); options.setAttribute('type' , 'button'); options.setAttribute('value' , resp); options.addEventListener('click' , function(){ doClick(resp); }); btns.push(options); } var divMain = document.getElementById('mainDiv'); for(var i = 0 ; i < btns.length ; ++i){ divMain.appendChild(btns[i]); // add btns to main div }

 <html> <body> <div id='mainDiv'></div> </body> </html>

Answer 2

您需要使用閉包。

代碼示例：

           var N = 5;
        var btns = [];
        for(var opt = 0 ; opt < N ; ++opt){ 
            var resp = "option #" + opt; 
            var resp=opt;
            var options = document.createElement('input'); 
            options.setAttribute('type' , 'button'); 
            options.setAttribute('value' , resp); 
            options.onclick=
                 (function(opt) {
                    return function() {
                         console.log("res: ",opt);
                }
                })(opt);

            btns.push(options);
        }
        var divMain = document.getElementById('mainDiv');
        for(var i = 0 ; i < btns.length ; ++i){
            divMain.appendChild(btns[i]); // add btns to main div
        }

在此示例中，每次單擊按鈕都會顯示不同的值。 因此，在我編寫console.log的位置設置您的代碼。

祝好運

添加JavaScript onclick功能

問題描述

2 個解決方案

解決方案1
0 2017-03-12 13:30:57

解決方案2
0 已采納 2017-03-12 13:38:26

添加JavaScript onclick功能

問題描述

2 個解決方案

解決方案1 0 2017-03-12 13:30:57

解決方案2 0 已采納 2017-03-12 13:38:26

解決方案1
0 2017-03-12 13:30:57

解決方案2
0 已采納 2017-03-12 13:38:26