Javascript - On（'Click'） - 错误 - 在页面加载时调用答案

【问题标题】：Javascript - On('Click') - Error - Calling On Page LoadJavascript - On（'Click'） - 错误 - 在页面加载时调用
【发布时间】：2013-07-20 00:01:58
【问题描述】：

<a href="#" class="audiocontrol"></a>
<a href="#" class="audiocontrol"></a>
<a href="#" class="audiocontrol"></a>
<a href="#" class="audiocontrol"></a>

<script>
    function playController(dataObj){
        alert(dataObj);
    }

    function playHandlers(){
        var dataObj = "stef";
        $('.audiocontrol').on('click', playController(dataObj));
    }

    $(document).ready(playHandlers);
</script>

无论我是否单击对象，这段代码都会在页面加载时触发。为什么？

【问题讨论】：

标签： javascript jquery onclick jquery-on clicklistener

【解决方案1】：

你想要的是：

function playController(dataObj){
    alert(dataObj);
}

function playHandlers(){
    var dataObj = "stef";
    $('.audiocontrol').on('click', function() { playController(dataObj); } );
}

$(document).ready(playHandlers);

按照您的代码编写方式，当您在 .on 调用中注册它时，它调用了 playController。

jsfiddle

【讨论】：

【解决方案2】：

您正在调用该函数，因此传递了playController 的结果。你可以这样做。

function playHandlers(){
    var dataObj = "stef";

    $('.audiocontrol').on('click', function() {
        playController(dataObj);
    });
}

【讨论】：

【解决方案3】：

这将起作用：
（演示here）

function playController(dataObj) {
    alert(dataObj);
}

function playHandlers() {
    var dataObj = "stef";
    $('.audiocontrol').on('click', function () {
    playController(dataObj)
   });
}
$(document).ready(playHandlers);

这将在页面加载时加载您的代码并调用函数playHandlers()。您之所以直接调用它，是因为您忘记在 on/click 调用中添加 function(){}。

【讨论】：