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