Javascript onclick不點擊執行

Question

我附加onclicks按鈕與我想在事件發生時被調用的函數。在運行頁面時，它會繼續執行onclick的功能，而無需單擊。

window.onload=function(){ 
var recipeCount = 0; 
//gets the recipes and puts them in the menu bar #left 
//places them in buttons 
$.getJSON('recipes.json', function(data) { 
     $.each(data.recipe, function(i, f) { 
     var yep = "</br> <button type='button' id = '" + f.number + "'>" + f.Name + "</button> </br>"; 
     $(yep).appendTo("#left"); 
     recipeCount = recipeCount + 1; 


    });//for each recipe 

    });//getJSON 
//ends recipes to menu 
for(var i = 1; i < recipeCount + 1; i++){ 
    $(i).onclick = clicked(i); 
} 
$("one").onclick = clicked("one"); 
};//on load 

function clicked(idNum){ 
    $.getJSON('recipes.json', function(data) { 
     $.each(data.recipe, function(i, f) { 
     if(idNum == f.number){ 
     var rec = "</br> <h1> " + f.Name + "</h1> " ; 
     $(rec).appendTo("#bigBox"); 

     } 

    });//for each recipe 

    });//getJSON 
}//clicked 

Answer 1

您直接調用clicked()函數並使其運行，這就是爲什麼。

正確的語法更像是：

$('#some-element').click(function(event) { 
    // inside click event handler 
}); 

換句話說，你想是這樣的：

$('#some-element').click(function(event) { 
    clicked('one'); 
}); 

如果您正在尋找原料JavaScript的風格，那麼我相信它會成爲：

$('#some-element')[0].onclick = functionName; 

Answer 2

第一個$("one")無效，應該是$(".one")如果其中一個是CSS類或$("#one")，如果其中一個是任何元素的ID。

其次你應該這樣做。

$("#one").click(function(event) { 
     clicked("one"); 
}); 

Answer 3

clicked(i) executes the function. 

你只是需要函數指針關聯到它。

$(i).onclick = clicked(i); 

應該

$('#'+ i).on('click' , function() { 
    clicked(i); 
}); 

但是，這將無法正常工作，你似乎可以用在你的getJSON的我值。 這是一個經典的關閉問題。

for(var i = 1; i < recipeCount + 1; i++){ 
    $('#'+ i).on('click' , function(num) { 
     return function() { 
       clicked(num); 
     } 
    }(i) 
); 

}