标签:clientx put enter 支持 == out word err 删除
1、用法
<!--jquery通过bind()这个方法来为元素绑定事件,可以传三个参数,type、data、fn--> <!--type表示一个或者多个事件的名称--> <!--data是可以选的,作为属性值传递额外的参数--> <!--fn表示绑定到的指定的事件后要执行的函数-->
2、基本事件的总结
<!--jquery的常见的事件类型--> <!-- 1.blur() 当失去焦点时触发。包括鼠标点击离开和TAB键离开。--> <!-- 2.change() 当元素获取焦点后,值改变失去焦点事触发。--> <!-- 3.click() 当鼠标单击时触发。--> <!-- 4.dblclick() 当鼠标双击时触发。--> <!-- 5.error() 当javascript出错或img的src属性无效时触发。--> <!-- 6.focus() 当元素获取焦点时触发。注意:某些对象不支持。--> <!-- 7.focusin() 当元素或其子元素获取焦点时触发,与focus()区别在于能够检测其内部子元素获取焦点的情况。--> <!-- 8.focusout() 当元素或者其子元素失去焦点时触发,与focusout()区别在于能够检测内部子元素失去焦点的情况。 --> <!-- 9.keydown() 当键盘按下时触发。--> <!-- 10.keyup() 当按键松开时触发。--> <!-- 11.mousedown() 当鼠标在元素上点击后触发。--> <!-- 12.mouseenter() 当鼠标在元素上穿过时触发。mouseenter与mouseover的区别是,鼠标从mouseover的子元素上穿过时也会触发而mouseenter不会。--> <!-- 13.mouseleave() 当鼠标从元素上移出时触发。--> <!-- 14.mousemove() 当鼠标在元素上移动时触发。.clientX 和 .clientY分别代表鼠标的X坐标与Y坐标。--> <!-- 15.mouseout() 当鼠标从元素上移开时触发。--> <!-- 16.mouseover() 当鼠标移入元素时触发。--> <!-- 17.mouseup() 当鼠标左键按下释放时触发。--> <!-- 18.resize() 当浏览器窗口大小改变时触发。 $(window).resize();--> <!-- 19.scroll() 当滚动条发生变化时触发。--> <!-- 20.select() 当input里的内容被选中时触发。--> <!-- 21.submit() 提交选中的表单。--> <!-- 22.unload() 当页面卸载【刷新】时触发-->
3、简单写一些例子来讨论事件的使用
<input type="button" name="name" value="提交"> <input type="text"> <input type="password"> <div class="cc">div测试</div> <script src="jquery-3.2.1.js"></script> <script> $(function () { // $("input").bind(‘click‘,function () { // alert("请输入") // }) // $("input").bind("click",f) // // function f() { // alert("请输入111") // } // 这种方法和上面的方法实现的效果是一样的 // 还可以同时绑定多个事件,事件和事件之间用空格隔开,下面这个例子实现的效果是单机和鼠标移入执行相同的函数 // $("input").bind("click mouseover",function () { // alert("xxxxxxxxxxxxxxxxxxx") // // }) //下面这个例子实现的效果就是鼠标移除和移入分别执行不同的函数 // $("input").bind({ // "mouseover":function () { // alert("鼠标移入") // }, // "mouseout":function () { // alert("鼠标移除") // } // }) // 删除所有的事件 // $("input").unbind() // 删除一个事件 // $("input").unbind("click") //mouseover,mouseout事件应用,鼠标移入和鼠标移除 // $("div").bind({ // "mouseover":function () { // $(this).css("font-size","40px") // }, // "mouseout":function () { // $(this).css("font-size","10px") // } // }) //keyup,keydown 键盘的事件 // $(":input[type=‘text‘]").bind("keyup",function () { // var a = $(this).val() // alert(a) // }) //focus,blur光标移入,光标丢失 // $("input[type=‘password‘]").bind({‘focus‘:function () { // alert("光标锁定") // }, // ‘blur‘:function () { // alert("光标移除") // } // })
4、函数还可以这样使用
$(":input[type=‘text‘]").bind(‘click‘,function () { var b = $(this).val() if(b == 1){ $(this).val(1111) }else if (b == 2){ $(this).val(2222) }else { $(this).val("xxxxxxxxxxxxxx") } })
标签:clientx put enter 支持 == out word err 删除
原文地址:http://www.cnblogs.com/bainianminguo/p/7659130.html