diff --git "a/14\350\226\233\346\231\226/\347\254\224\350\256\260/11.24jQuery\344\270\213.md" "b/14\350\226\233\346\231\226/\347\254\224\350\256\260/11.24jQuery\344\270\213.md" new file mode 100644 index 0000000000000000000000000000000000000000..4758a8e1d435f18aef049349339725d224629722 --- /dev/null +++ "b/14\350\226\233\346\231\226/\347\254\224\350\256\260/11.24jQuery\344\270\213.md" @@ -0,0 +1,129 @@ +### Jquery + +#### 一、绑定 + +##### 1、bind函数 + +$('选择器').bind({"事件名称":匿名函数}) + +例: + + + $('button').bind('click':function(){}) + //函数内容 + + + +##### 2、on函数 + +两个形参 + +$('选择器').on('事件名称':匿名函数) + +例: + + + $('button').on('click':function(){}) + //函数内容 + + + +三个参数 + +$(“父节点选择器”).on(“事件名称”,“孩子节点,即要绑定的元素”,匿名函数) + +例: + + + $('ul').on('click','li',function(){ + $(this).css("color":"blue") + }) + + + +#### 二、解绑函数 + +##### 1、off() + +不带参时默认全部事件解绑 + +$(function () { + $('#btn').click( + function () { + alert('点击了'); + } + ).dblclick( + function () { + alert('双击'); + } + ).off(); + }) + + + +##### 2、unbind + +unbind方法只能解绑用jQuery的bind方法以及用jQuery方法注册的事件处理程序。 + +用法: + +- $("选择器").unbind():如果没有参数,则表示解绑该元素绑定的所有事件 +- $("选择器").unbind("事件名称"):解绑该元素绑定的某种事件。 +- $("选择器").unbind("事件名称","事件名称"):多个参数之间用逗号隔开,表示解绑多个事件。 + +#### 三、一次事件 + +##### 1、one() + +当前元素只触发一次该事件one(事件类型,function) + +$(function () { + $('#btn').one('click',function () { + alert('点击'); + }) + }) + + + +#### 四、event + +当回调函数被触发后,它们的参数通常是一个事件对象event。 + +##### 1、event方法: + +- **preventDefault**:取消浏览器默认行为。 +- **stopPropagation**:阻止事件向上层元素传播。 + + $(function () { + $('#btn').click( + function (event) { + console.log('btn'); + } + ) +}) +$(function () { + $('#div').click( + function (event) { + console.log('div触发了'); + } + ) +}) + + + + + + + +### hover(鼠标移入移出) + +$(function () { + $('div').hover( + function () { + $(this).css('color','red') + }, + function () { + $(this).css('color','white') + } + ) + })