jQuery trigger one用法:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>b index</title>
<link rel='stylesheet' type="text/css" href='b/css/bootstrap.css'>
<style type="text/css">
.s1{
width: 100px;
height: 100px;
background-color: pink;
}
.s2{
width: 50px;
height: 50px;
background-color: green;
}
</style>
</head>
<body style="margin:1px;">
<div id="div001">div001</div>
<div id='div002'>div002
<input id='txt001'>
</div>
<div id='div003'>div003 click this to use one(type,data,fn)</div>
<div>
<button id="btn001">click me to trigger myClick </button>
<button id="btn002">click me to trigger focus </button>
<button id="btn003">click me to triggerHandler focus </button>
</div>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="b/js/bootstrap.js"></script>
<script type="text/javascript" src="js/index040.js"></script>
</body>
</html>
$(function() {
$('#btn001').bind('myClick', function(e, msg1, msg2) {
console.log(msg1 + msg2);
});
$('#btn001').click(btn001Click);
$('#txt001').focus(txt001Focus);
$('#btn002').click(btn002Click);
$('#btn003').click(btn003Click);
$('#div003').one('click', [ 'msg1', 'msg2' ], div003OneClick);
});
function btn001Click(e) {
// 可以将参数传入;
$('#btn001').trigger('myClick', [ 'msg1', 'msg2' ]);
}
function txt001Focus(e) {
console.log('txt001Focus');
}
function btn002Click(e) {
// 会执行focus事件,并且会触发浏览器默认事件
$('#txt001').trigger('focus');
}
function btn003Click(e) {
// 会执行focus事件,但是不会触发浏览器事件
$('#txt001').triggerHandler('focus');
}
function div003OneClick(e, msg1, msg2) {
// 这样获取不到参数;
console.log(msg1 + msg2);
// 可以用这样的方式获取输入的参数
console.log(e.data);
}