在上一篇《使用JavaScript从数组中删除最后一项（3种方法）》中给大家介绍了怎么使用JavaScript从数组中删除最后一项，感兴趣的朋友可以去学习了解一下~
本文讲解的重要内容是通过jQuery将单击和双击事件添加到元素中的方法。
在本文中我们将通过bind() 方法添加单击和双击事件。bind() 方法向被选元素添加一个或多个事件处理程序，以及当事件发生时运行的函数。此外，我们还会使用appendTo() 方法将结果添加到元素，appendTo() 方法在被选元素的结尾（仍然在内部）插入指定内容。
下面我们直接上代码：
复制代码1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery.min.js"></script>
<script>
$(document).ready(function () {
$(".clickable_ele").bind("click", function () {
$("<h4>调用单击事件</h4>")
.appendTo(".res");
});
$(".clickable_ele").bind("dblclick", function () {
$("<h4>调用双击事件</h4>")
.appendTo(".res");
});
});
</script>
<style>
body {
text-align: center;
}
h1 {
color: #ff311f;
}
.clickable_ele {
font-size: 20px;
font-weight: bold;
color: #ff7800;
}
</style>
</head>
<body>
<h1>靠谱客</h1>
<h3>
如何给一个元素添加单击和双击事件?
</h3>
<div class="clickable_ele">
可点击的元素
</div>
<div class="res"></div>
</body>
</html>
登录后复制效果如下：
bind()语法是
$(selector).bind(event,data,function,map)
复制代码1
2
3
4
5
6
参数分别表示：
event必需。规定添加到元素的一个或多个事件。
由空格分隔多个事件值。必须是有效的事件。
data可选。规定传递到函数的额外数据。
function必需。规定当事件发生时运行的函数。
map规定事件映射 ({event:function, event:function, ...})，包含要添加到元素的一个或多个事件，以及当事件发生时运行的函数。
登录后复制appendTo()语法是
$(content).appendTo(selector)
复制代码1
2
3
参数分别表示：
content必需。规定要插入的内容（可包含 HTML 标签）。
selector必需。规定把内容追加到哪个元素上。
登录后复制注：
自 jQuery 版本 1.7 起，on() 方法是向被选元素添加事件处理程序的首选方法。
append() 和 appendTo() 方法执行的任务相同；不同之处在于：内容和选择器的位置，以及 append() 能够使用函数来附加内容。
最后给大家推荐《JavaScript基础教程》~欢迎大家学习~
以上就是如何通过jQuery给一个元素添加单击和双击事件的详细内容，更多请关注靠谱客其它相关文章！
最后
以上就是体贴可乐最近收集整理的关于如何通过jQuery给一个元素添加单击和双击事件的全部内容，更多相关如何通过jQuery给一个元素添加单击和双击事件内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复