使用onclick调用函数或使用.click绑定事件是否更好?

时间:2013-02-28 07:34:58

标签: javascript jquery events onclick onclicklistener

假设我有一个div,并且我想在用户点击该div时运行某个代码。我可以通过两种方式实现这一目标。

HTML

<div id="clickme">Click Me</div>

的Javascript

$(document).ready(function(){
    $('#clickme').click(function(){
        //Other code here doing abc.
    });
});

第二种方法是调用一个完全相同的函数,但它由一个函数调用

<div id="clickme" onclick="clickme()">Click Me</div>

的Javascript

function clickme(){
    //Other code doing abc.
}

我的问题是这两个代码都在做同样的事情吗?哪个更有效率和推荐?

3 个答案:

答案 0 :(得分:2)

这取决于。如果它非常简单,我更喜欢使用onlick =“”。

另一方面,如果它更复杂并且你想执行大量代码,我更喜欢使用绑定事件以便于阅读。

我真的相信onclick =“”在性能/内存使用等方面更好。您正在使用的绑定事件位于jquery层中,并且通过onclick直接从您的元素调用事件。

这是一个选择问题,真的。

我在绑定事件中喜欢的东西是你有什么可以绑定和捕获点击或击键的无限可能性。还有jquery插件来增强绑定事件,例如带有延迟的绑定等(带有延迟的绑定是当你按下一个键并且代码被执行x秒后按下它,这在你键入时进行搜索时很棒通过ajax,因为它阻止了每个键按下的请求)

如果您需要更多信息,请与我们联系。

希望我能给你一个很好的见解:)。

答案 1 :(得分:1)

使用.click(function(){}会更好,因为它遵循标准事件注册模型。

在这里你可以分配多个回调,

EX:

<script type="text/javascript">
$(document).ready(function() {
    $("#clickme").click(function() {
        alert("clicked!");
    });
    $("#clickme").click(function() {
        alert("I concur, clicked!");
    });
});
</script>

如果你用click()绑定你的click函数,那么你可以取消绑定特定的函数取决于要求。

答案 2 :(得分:1)

这取决于您是否愿意:

1)在JQuery的文档就绪事件中绑定的匿名函数

这意味着您的命名空间不会与您不关心的另一个函数名称混在一起。它还意味着代码与其余的初始化例程一起。它还允许您绑定多个事件。

2)绑定命名函数的声明方式。

这意味着您的函数需要相应地命名,您必须搜索文档以查看它是否/在何处绑定。它也是一个较少的选择器调用,所以当然它在速度方面更有效。

为了清晰编码,大多数时候我会建议您将javascript初始化代码与HTML声明分开。