元素的大部分事件都是用户触发执行的，比如click事件，mousemove事件，等等
当然，可以通过代码来模拟用户的操作
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function () {
$('#btn1').click(function () {
alert('click first button')
})
$('#btn2').click(function () {
$('#btn1').trigger('click')
})
})
</script>
</head>
<body>
<button id="btn1">click me</button>
<button id="btn2">模拟点击第一个按钮</button>
</body>
</html>trigger() 方法触发被选元素上指定的事件以及事件的默认行为（比如表单提交）。
triggerHandler()方法同样也能触发被选元素上指定的事件
但是二者也有区别
区别1 .trigger()会操作jQuery对象匹配的所有元素，而triggerHandler()只会影响匹配到的第一个元素。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function(){
// 给按钮绑定click事件处理函数
$("input[type=button]").click(function(event){
alert($(this).val());
});
// 选中的button集合中,触发所有button的click,打印出button1,button2,button3
$("input[type=button]").trigger("click");
})
</script>
</head>
<body>
<input type="button" id="1" value="button1">
<input type="button" id="2" value="button2">
<input type="button" id="3" value="button3">
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function(){
// 给按钮绑定click事件处理函数
$("input[type=button]").click(function(event){
alert($(this).val());
});
// 选中的button集合中,只触发第一个button的click事件,只打印出button1
$("input[type=button]").triggerHandler("click");
})
</script>
</head>
<body>
<input type="button" id="1" value="button1">
<input type="button" id="2" value="button2">
<input type="button" id="3" value="button3">
</body>
</html>区别2：由triggerHandler()创建的事件不会在DOM树种冒泡；如果目标元素不直接处理它们，则不会发生任何事情。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<style>
#outA {
width: 400px;
height: 400px;
border: solid 1px #CDC9C9;
position: relative
}
#outB {
width: 200px;
height: 200px;
border: solid 1px #0000ff;
top: 50px;
left: 50px;
position: absolute;
}
#outC {
width: 100px;
height: 100px;
border: solid 1px #FFB90F;
top: 50px;
left: 50px;
position: absolute;
}
</style>
<script>
$(function () {
$("#outA").click(function () {
alert("A");
});
$("#outB").click(function () {
alert("B");
});
$("#outC").click(function () {
alert("C");
});
// 使用trigger,依次C、B、A
$("#outC").trigger("click");
});
</script>
</head>
<body>
<div id="outA">A
<div id="outB">B
<div id="outC">C</div>
</div>
</div>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<style>
#outA {
width: 400px;
height: 400px;
border: solid 1px #CDC9C9;
position: relative
}
#outB {
width: 200px;
height: 200px;
border: solid 1px #0000ff;
top: 50px;
left: 50px;
position: absolute;
}
#outC {
width: 100px;
height: 100px;
border: solid 1px #FFB90F;
top: 50px;
left: 50px;
position: absolute;
}
</style>
<script>
$(function () {
$("#outA").click(function () {
alert("A");
});
$("#outB").click(function () {
alert("B");
});
$("#outC").click(function () {
alert("C");
});
// 使用trigger,只会打印出C
$("#outC").triggerHandler("click");
});
</script>
</head>
<body>
<div id="outA">A
<div id="outB">B
<div id="outC">C</div>
</div>
</div>
</body>
</html>区别三：trigger会触发事件的默认行为，而triggerHandler则不会（如表单提交）。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
function myvalid()
{
var name = $('#name').val()
if (name== '' || name == null) {
alert('用户名不能为空')
$('#name').focus()
// return false
}
}
$(function () {
$('#form1').trigger('submit')
// $('#form1').triggerHandler('submit')
})
</script>
</head>
<body>
<form id="form1" action="1.php" method="post" οnsubmit="return myvalid()">
<div>
<label for="name">用户名</label>
<input type="text" name="name" id="name">
</div>
<input type="submit" value="submit">
</form>
</body>
</html>