11

有一段代码为

/* TAB DATA-API
 * ============ */

 $(function () {
   $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
     e.preventDefault()
     $(this).tab('show')
   })
 })

在文件Bootstrap--tab 我不明白'click.tab.data-api'and'[data-toggle="tab"], [data-toggle="pill"]'

谁能给我解释一下？谢谢~~

4

2 回答 2

15

这click.tab.data-api是一个带有命名空间“tab.data-api”的点击事件。您可以在此处查看文档（事件和命名空间部分）。

如果我没记错的话，data-* 是 Html5 标准中的一个新的自定义数据属性，当您想要定义自己的属性或数据时，它会派上用场。查看John 的解释数据属性的帖子。

于 2012-08-16T05:51:41.440 回答
8

Bootstrap 开发人员标记他们的点击事件以避免触及您的点击事件。

它实际上是一个普通的单击事件处理程序，但添加了一个对unbinding很有用的 jQuery 命名空间。

$('body').on('click', handler1)与$('body').on('click.something', handler2) 两者将绑定和处理单击事件相同。您通常在事件上绑定一个处理程序，但有时您需要同时做出更多反应。

稍后，如果您想解除绑定，可以使用$('body').off('click')删除两个处理程序，或$('body').off('.something')仅删除第二个处理程序。

http://api.jquery.com/on/#event-names

于 2014-07-28T12:25:00.330 回答