按鈕在加載時自動點擊一次，然後無法點擊

Question

我試圖讓按鈕單擊導致變量增加1，然後更新顯示變量的頁面計數器。出於某種原因，在頁面加載時，該按鈕顯然會點擊一次，並且任何實際的點擊都不會執行任何操作。

我試過$("#click").click(click(1));並將onClick="click(1)"放在按鈕的實際HTML上，但兩者似乎都輸出了相同的結果。

下面是相關的HTML：

<div class="column_middle"> 
    <div style="font-size:115%;display:inline;">Money: <span id="money">0</span></div> 

    <button id="click" class="mainbutton" style="margin:10px;margin-right:5px;" title="">Click</button> 

及相關的javascript：

// Activated on DOM load 
function onLoad(jQuery) { 
    // Set up button functions 
    $("#click").click(click(1)); 
} 

function click(amount) { // Player clicking 
    money += amount; // Add the amount of clicks to the total money 

    html_money.text(money); // Update page money value 

    console.log("Clicked "+amount+" times."); 
} 

// Variable declaration 
var money = 0; // Total money 
var stock = 0; // Total stock 
    var html_money = $("#money"); // Money variable on the actual page 
    var html_stock = $("#stock"); // Stock variable on the actual page 

Answer 1

至少下面這行不起作用：$("#click").click(click(1));，因爲在click事件中，您將「執行」click函數（void）的返回值，而不是函數本身。

試試這個：

<div class="column_middle"> 
    <div style="font-size:115%;display:inline;">Money: <span id="money">0</span></div> 
    <button id="incrementButton" class="mainbutton" style="margin:10px;margin-right:5px;" title="">Click</button> 
</div> 

JS：

$(document).ready(function() { 

    var increment = function (amount) { 
    $('#money').text(
     parseInt($('#money').text(), 10) + amount 
    ); 
    } 

    $('#incrementButton').click(function() { 
    increment(1); 
    }); 

    increment(1); 

}); 

我還創建了一個小提琴：http://jsfiddle.net/cP6Lq/

Answer 2

改變你的代碼：

function incrementMoney(amount) { // Player clicking 
    $("#money").html(parseInt($("#money").html()) + amount); 
} 

$(document).ready(function() { 
    $("#click").click(function(){ 
     incrementMoney(1)); 
    }); 
} 

避免使用限定的名字是非常重要的特別是如果你有像功能一樣命名的元素ID。