<html>
<head>
</head>
<body>
<button id="btn1">按钮1</button>
<button id="btn2">按钮2</button>
<button id="btn3">按钮3</button>
<select class="" name="">
<option value="iPhone">iPhone</option>
<option value="iPad">iPad</option>
</select>
</body>
/*引入jQuery*/
<script src="jquery-2.2.3.js" charset="utf-8"></script>
<script type="text/javascript>
$(function (){
// 给按钮绑定事件
// 可以通过群组选择器选出多个元素，并且可以同时添加事件
// 可以同时给元素绑定多个事件，只需要在on()的第一个参数的位置添加事件类型，中间使用空格分隔，即可
// $('#btn1, #btn2').on('click mouseover mouseout', function (e) {
// 使用on()方式绑定的事件的回调中，内部的this为触发该方法的原生DOM对象。
// 如果需要使用，建议转为JQ元素，后续使用JQ方法
// var $this = $(this);
// $this.html('button');
//
// 每次函数被调用，都会产生一个事件对象，就是函数的参数e，并且JQ已经出了兼容的问题
// 通过e.type就可以获取事件类型
// console.log(e.type);
// console.log(e);
// });
// 移除事件
// $('#btn1, #btn2').off('mouseover mouseout');
// 绑定一次事件
// $('#btn3').one('click', function () {
// console.log(this);
// });
// $('#btn1').on('click mouseover', function (e) {
// if (e.type == 'click') {
// console.log('click');
// } else if (e.type == 'mouseover') {
// console.log('mouseover');
// }
// });
// 如果给一个按钮绑定多个事情的时候，可以给on()方法传递一个对象，方法类型和对于的函数以键值对的方式传入
// $('#btn1').on({
// 'click': function () {
// console.log('click');
// },
// 'mouseover': function () {
// console.log('mouseover');
// }
// });
// 简化事件的绑定
$('#btn1').click(function () {
console.log('click');
});
$('#btn2').mouseout(function () {
console.log('dblclick');
});
$('select').change(function () {
console.log(this.value);
});
// 浏览器大小发生改变
$(window).resize(function () {
console.log('fads');
});
});
</script>
</html>
jQuery--代理
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 作为一名前端开发工程师，我们在开发中经常会遇到跨域这个问题。今天想从跨域的原理说起，接着到解决方案，最后到框架对跨...
- 一．创建节点 1 2 二．插入节点jQuery 提供了好几种个方法来插入节点：1、内部插入节点方法方法名描述app...
