<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="main.css">
<script src="jquery-3.3.1.min.js"></script>
</head>
<body>
<button id="test">?</button>
<button id="del">del</button>
<button id="simulation">simulation</button>
<button id="data">data</button>
<script>
$(function(){
$("#test").bind("click.ns",func1=function(){
console.log(1);
}).bind("mouseover.ns",func2=function(){
console.log(2);
}).bind("click",func3=function(){
console.log(3);
});
//bind方法实际上可以同时绑定多个事件类型给一个函数
//用命名空间规范事件类型
//注意第一个与第三个,对于相同的事件名称用不同的命名空间执行方法进行按需调用
$("#del").bind("click",function(){
$("#test").unbind(".ns",func1);//移除ns空间下的事件
$("#test").unbind("click",func1);//移除点击事件中的func1
//当不写参数时,即移除其所有绑定事件
}) //.trigger("click!"): 匹配所有没有被规范入命名空间的click事件
// jQuery提供了一个一次性的使用方法,one(),只会触发一次,然后就被移除 // 模拟操作,如模拟用户的点击
$("#simulation").mouseover(function(){
$("#simulation").trigger("click");//也可直接.click()
});
$("#simulation").click(function(){
console.log("success simulation");
})
// trigger()方法能够触发自定义的事件,如在bind中设置触发事件为blabla,可以用.trigger("blabla")模拟这个事件
//传递数据
$("#data").bind("sp",function(event,argu1,argu2){
$("#data").parent().append("<p>"+argu1+argu2+"</p>");
})
$("#data").trigger("sp",["testtext1","testtext2"]);
}) </script>
</body>
</html>
3.30补充:使用trigger()方法,会触发浏览器本身的默认操作,如$("input).trigger("focus"),会同时使input元素得到焦点(浏览器的默认操作),
如果不想执行浏览器默认操作,可使用triggerHandler()方法