1、bind：
•
bind(type,[data],fn)
：
为每个匹配元素的特定事件绑定对应的事件处理函数
，各参数含义如下：
1.
type
表示事件类型，多个事件类型使用空格分隔；
2.
data
表示传递给绑定函数的额外数据对象，函数中使用
event.data
接收（
了解
）；
3.
fn
表示绑定的函数；
按下enter键。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>bind(type,[data],fn)</title>
<script src="js/jquery-3.3.1.js"></script>
<script>
$(function() {
$(window).bind('keydown', function(event) {
var key = event.which;
if(key == 13) {
console.log("Enter键");
}
});
});
</script>
</head>
<body>
</body>
</html>2、unbind:
•
unbind(type,[
data|fn
]])
：
删除每个匹配的元素上已绑定的事件，如果没有参数，则删除该元素上绑定的所有事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>unbind(type,[data|fn]])</title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<span>白日依山尽，黄河入海流。</span>
<script>
$("span").bind({
mouseover: function() {
$("span").css("color", "red");
},
mouseout: function() {
$("span").css("color", "blue");
}
});
$("span").unbind("mouseover mouseout");
</script>
</body>
</html><input type="button" value="按钮" />
<script>
$("input").one("click",function(){
console.log(111);
})
$("input").bind("click",function(){
console.log(222);
})
$("input").unbind("click");
</script>3.one:
one(type,[data],fn)：该方法可以为元素绑定处理函数，当处理函数触发一次后, 立即被删除，即在每个对象上, 事件处理函数只会被执行一次
<input type="button" value="按钮" />
<script>
$("input").one("click",function(){
console.log(111);
});
</script>4.trigger:
•
trigger(type,[data])
：
触发
每一个匹配元素上某类事件，
type
表示一个或多个事件类型，
data
表示传入函数的数据，例子如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>submit([[data],fn])</title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<form id="search" action="https://www.baidu.com/s">
<input type="hidden" name="wd" value="中国"/>
</form>
<script>
$("#search").trigger("submit");
</script>
</body>
change([[data],fn])
：
文本框、密码框和文本域的值
发生改变时或
下拉列表选项发生变化时触发
change
事件；
6.click:鼠标点击匹配元素时触发click事件，例子如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>click([[data],fn])</title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<form id="search" action="https://www.baidu.com/s">
<input type="hidden" name="wd" value="中国"/>
<input type="button" id="search_btn" value="百度一下" />
</form>
<script>
$("#search_btn").click(function(){
$("#search").submit();
})
</script>
</body>
</html>7.keydown:
keydown([[data],fn])
：
当键盘或按钮被按下时触发keydown事件
，例子如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>click([[data],fn])</title>
<script src="js/jquery-3.3.1.js"></script>
<script>
$(window).keydown(function(event) {
if(event.keyCode == 13) {
console.log("Enter键");
}
});
</script>
</head>
<body>
</body>
</html>8.submit:提交表单时触发submit 事件，该事件只适用于表单元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>submit([[data],fn])</title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<form id="search" action="https://www.baidu.com/s">
<input type="hidden" name="wd" value="中国"/>
</form>
<script>
$("#search").submit();
</script>
</body>
</html>9.事件冒泡：事件会按照 DOM 层次结构像水泡一样不断向上直至顶端；事件处理函数中返回 false, 会对事件停止冒泡，还可以停止元素的默认行为
如下面的代码是先执行onclick 然后跳转 最后到标签
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<!--超链接失效，点击无法跳转-->
<a href="http://www.baidu.com" οnclick="return test();">百度</a>
<script>
function test(){
console.log("点击了...");
return false;
}
</script>
</body>
</html>
return true 则会跳转。
