0 
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>css demo</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
    $(document).ready(function(){
        $('button').click(function(){
            //$(this).clone().appendTo('div');
            $(this).clone().prependTo('div');
        })

        $('button').bind('click', function(){
            $(this).clone().appendTo('div');
        })
    });
</script>
</head>
<body>
    <h1> My WebSite</h1>
    <div>
        <button data-file="day">Day</button>
        <button data-file="night">Night</button>
    </div>
</body>
</html>

当我运行代码时，我没有看到这两者之间有任何区别，因为它将元素克隆到我的 div 标签。bind 方法有什么特别之处？

http://api.jquery.com/category/events/

我正在查看文档，如果我错了，请纠正我......如果点击和绑定做同样的事情，为什么他们有两种不同的方式来实现相同的目标？

4

3 回答 3

2

您的示例正在运行完全相同的代码 -click是一个快捷方式处理程序。请注意，on现在这是将事件附加到bind.

on使用（以及在以前的版本中）的最常见原因bind是它允许您连接自定义事件：

$('.foo').trigger('someEvent.myPlugin');

// in another file, far far away
$('.foo').on('someEvent', function() {
    // deal with someEvent on foo
});

最常见的是，您可以只使用click,change等实用程序。

于 2013-08-17T16:51:21.783 回答
1

他们之间没有区别

jQuery 提供了一些实用函数，如click(),change()等来为常见事件注册处理程序，它们在内部使用 bind()和on()- 新版本等函数

于 2013-08-17T16:51:37.873 回答
1

Bind 是通用的、较低级别的函数。Click 是一种快捷方式，是 Bind 的更高级别实现。绑定也或多或少被弃用，您应该使用“on”绑定。IE

$('selector'.on("click", function () {

});

使用“on”绑定的原因是您可以选择利用事件委托。因为你也可以这样做

$('ul'.on("click", "li", function () {
   //do something whenever one of the list items is clicked
});

这样做的一个原因是您不必将事件绑定到每个列表项元素。相反，您可以将一个事件附加到父级。假设你有 200 个列表项，如果你使用 click

$('li'.on("click", function () {
   //thing to do on click
});

每个元素都有自己的侦听器，这将是低效的。但是通过定位 ul 包装父级并监听事件冒泡，您只需附加到一个元素。这样更有效率。在 Internet 上查找事件传播或事件冒泡。一个简单的解释是，当 DOM 中发生事件时，该事件会传播给父级。因此，如果您单击 li，则 ul 也将收到该事件，就像任何其他包装 ul 和 body 并一直到窗口的 div 一样。

于 2013-08-17T16:53:01.530 回答