解绑事件

 <script>// $(function(){//    //第一个按钮通过on的方式绑定点击事件//  $("#btn1").on('click',function(){//         alert('我被点击了');//     });//   //第二个按钮把第一个按钮的点击事件解绑//  $('#btn2').on('click',function(){//         //off() 参数： 要解绑的事件的名字//      $('#btn1').off('click'); //解绑事件//   })// })// </script><!--    <script>//绑定事件$(function(){//通过bind绑定按钮的点击事件$('#btn1').bind('click',function(){alert('我可以被点击了');});//第二个按钮unbind解绑事件$('#btn2').bind('click',function(){$('#btn1').unbind('click'); //解绑事件})})</script> --><script>$(function(){//点击第一个按钮，为div中的p标签绑定点击事件$('#btn1').click(function(){$('#dv').delegate('p','click',function(){alert('我被点击了');})});//点击第二个按钮为div中p解除绑定事件$('#btn2').click(function(){$('#dv').undelegate('p','click'); //解绑事件})})</script>

解绑细节问题

 <script>$(function(){//为div和p都绑定点击事件// $('div>p').click(function(){//    alert('p标签被点击了');// });$("#dv").delegate('p','click',function(){alert('p标签被点击了');});$('#dv').click(function(){alert('div被点击了');});$('#btn2').click(function(){$('#dv').off('click'); //div下的所有的点击事件都被解绑了//下面的代码是把子级元素的点击事件解绑了,父级元素的点击事件还存在// $('#dv').off('click','**');$('#dv').off();//移除父级元素和子级元素的所有的事件})
//如果说父级元素和子级元素都是通过正常的方式绑定事件,如果通过off解绑的时候,父级元素的事件解绑了,子级元素的事件没有解绑
//但是:如果子级元素是通过父级元素调用delegate的方式绑定的事件,父级元素使用off方式解绑事件,这个时候父级元素和子级元素的相同的事件都会被解绑});</script>

trigger触发事件

    <script>$(function () {$("#btn1").click(function () {$(this).css("backgroundColor","red");});//点击第二个按钮调用第一个按钮的点击事件---触发第一个按钮的点击事件$("#btn2").click(function () {//触发事件--3三种方式//$("#btn1").click();//trigget()方法中需要写上触发事件的名字//$("#btn1").trigger("click");//触发事件$("#btn1").triggerHandler("click");//触发事件});});</script>

触发默认事件

    <script>$(function () {$("#btn").click(function () {//触发文本框的获取焦点的事件// $("#txt").focus();//$("#txt").trigger("focus");$("#txt").triggerHandler("focus");$("#sp").text("文本框获取到焦点了");//第一种触发事件的方式和第二种触发事件的方式是相同的,都会触发浏览器默认的事件(光标在文本框中闪烁)//第三种触发事件的方式不会触发浏览器的默认事件});});</script>

事件对象

    <script>$(function () {//为div中的按钮绑定事件,获取事件对象中内容$("#dv").on("click","input",function (event) {//获取函数在调用的时候,有几个参数//console.log(arguments[0]);console.log(event);//event.delegateTarget----->div--->谁代替元素绑定的事件--div//event.currentTarget----->input--->真正是谁绑定的事件//event.target---->input----触发的事件});});</script>

键盘事件

<script>$(function () {$(document).keydown(function (e) {var keyCode=e.keyCode;//键盘按下后的键对应的键值switch (keyCode){case 65:$("#dv").css("backgroundColor","red");break;case 66:$("#dv").css("backgroundColor","green");break;case 67:$("#dv").css("backgroundColor","blue");break;case 68:$("#dv").css("backgroundColor","yellow");break;case 69:$("#dv").css("backgroundColor","black");break;}});});</script>

事件冒泡

<script>//事件冒泡:元素中有元素,这些元素都有相同的事件,一旦最里面的元素的事件触发了,外面的所有的元素的相同的事件都会被触发//元素A中有一个元素B,A和B都有点击事件,B点击事件触发,A点击事件自动触发//取消事件冒泡//jQuery中  return false$(function () {$("#dv1").click(function () {alert("dv1被点了"+$(this).attr("id"));});$("#dv2").click(function () {alert("dv2被点了"+$(this).attr("id"));//$("body").css("backgroundColor","black");});$("#dv3").click(function () {alert("dv3被点了"+$(this).attr("id"));return false;//取消事件冒泡});});</script>

链式编程

  function Student(name) {// console.log(name);this.name=name;this.sayHi=function (name) {// console.log(name);if(name){console.log("俺是"+name);return this;}else{console.log("我的名字叫"+this.name);}
//                console.log("我的名字叫"+this.name);
//                return this;//把当前对象返回};this.eat=function () {console.log("我就是喜欢吃大蒜+榴莲+臭豆腐");};}var stu=new Student('大白');stu.sayHi('楚楚笔笔').eat();

评分星级

 <script>
//        $(function () {//            //获取所有的li绑定鼠标进入和鼠标离开和点击事件
//            $(".comment>li").mouseover(function () {//                $(this).text("★").prevAll("li").text("★").end().nextAll("li").text("☆");
//            }).mouseout(function () {//                $(this).text("☆").prevAll("li").text("☆");
//                //获取属性index为10的这个li和这个li前面所有的li
//                $(".comment>li[index=10]").text("★").prevAll("li").text("★");
//
//            }).click(function () {//                $(this).attr("index","10").siblings("li").removeAttr("index");
//            });
//        });</script><script>$(function () {$(".comment>li").mouseover(function () {$(this).text("★").prevAll("li").text("★").end().nextAll("li").text("☆");}).mouseout(function () {$(".comment").find("li").text("☆");$(".comment>li[index=1]").text("★").prevAll("li").text("★")}).click(function () {$(this).attr("index","1").siblings("li").removeAttr("index");});});</script>

each 索引遍历

    <script>$(function () {//页面加载后,让每个li的透明度发生改变//不同的元素不同的设置方式--each方法$("#uu>li").each(function (index,element) {//第一个参数是索引,第二个参数是对象//console.log(arguments[0]+"====="+arguments[1]);$(element).css("opacity",(index+1)/10);});});</script>

多库共存

    <script>//让jquery对$对象进行释放控制权
//        var xy=$.noConflict();
//        //从此以后xy就是曾经的$---一毛一样的
//        var $=100;//$原本是对象--->变量
//        xy(function () {//            xy("#btn").click(function () {//                alert("哈哈,我又变帅了");
//            });
//        });var $=100;//$原本是对象--->变量jQuery(function () {jQuery("#btn").click(function () {alert("哈哈,我又变帅了");});});</script>

jquery自定义插件

<script>$.fn.changeBackgrounColor=function(color) { //先声明后使用 2$(".cls").css("backgroundColor",color);}$(function(){//点击每个按钮改变每个div的背景颜色$('input[type=button]').click(function(){$('.cls').changeBackgrounColor($(this).val()); //2// $('.cls').css('backgroundColor',$(this).val());//.css设置样式//changeBackgrounColor($(this).val()); //第一中})})function changeBackgrounColor(color) { //先声明后使用 第一中$(".cls").css("backgroundColor",color);}</script>

jquery解绑、绑定笔记相关推荐

android 极光推送解绑,app集成极光推送笔记(angular js)
出处:极光推送官方文档以及github上的文档 1.安装一般使用cordova安装(其他安装方式详见文档),命令行输入: cordova plugin add jpush-phonegap-plug ...
工具使用，Virbox用户工具（Linux)，深思数盾，离线软锁加密，离线解绑，加壳软件，加壳工具，Virbox离线加密
文章目录 1,安装Virbox用户工具(Linux) 1.1,查看系统位数 1.2,下载相应安装包 1.3,安装 2,在Virbox LM 开发者中心设置账号许可,用于软锁离线加密 2.1,产品管理 ...
公众帐号被系统冻结后，如何解绑管理员？
帐号被系统冻结,公众号绑定邮箱.主体次数.手机号.管理员微信号.运营者微信号如何释放? 如需释放公众号绑定邮箱.主体次数.管理员信息,请按照找回操作方法指引,找回帐号后再申请注销(方法:登录公众号-& ...
dom事件对象、解绑事件、事件委托、页面加载、滚动事件、页面尺寸事件
1.e.type获取事件类型,例如click input focus <input type="text"> <script>let input=docum ...
jquery事件绑定解绑机制源码分析
引子为什么Jquery能实现不传回调函数也能解绑事件?如下: $("p").on("click",function(){alert("The par ...
JQuery事件绑定解绑方法小结
常用的方法绑定:bind().delegate().on() 解绑:unbind().undelegate().off() 此外还有live() 不过JQuery1.9及其以上版本删除了此方法推荐 ...
jQuery的绑定与解绑方法
jQuery的4种绑定方法一.bind()与unbind() I.bind():绑定 1.定义 2.语法 3.参数 4.案例 (1)绑定单一事件 (2)绑定多个事件 II.unbind():解绑 1 ...
jQuery事件绑定与解绑
一.jQuery事件方法描述执行时机 click() 触发或将函数绑定到指定元素的click事件单击鼠标时 dblclick() 触发或将函数绑定到指定元素的dblclick事件双击鼠标时 ...
jQuery的事件绑定和解绑
1.绑定事件语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...

jquery解绑、绑定笔记

解绑事件

解绑细节问题

trigger触发事件

触发默认事件

事件对象

键盘事件

事件冒泡

链式编程

评分星级

each 索引遍历

多库共存

jquery自定义插件

jquery解绑、绑定笔记相关推荐

最新文章

热门文章

jquery解绑、绑定笔记

解绑事件

解绑细节问题

trigger触发事件

触发默认事件

事件对象

键盘事件

事件冒泡

链式编程

评分星级

each 索引 遍历

多库共存

jquery自定义插件

jquery解绑、绑定笔记相关推荐

最新文章

热门文章

each 索引遍历