`

jquery custom event

 
阅读更多
先说说jquery关于事件的处理方式,在jquery中,函数要想被触发,需要至少四个因素:
1、事件对象
2、事件执行函数
3、将事件执行函数和事件对象进行绑定到某个具体的监听对象上
4、触发该事件

举例:
    //首先定义一个事件处理函数:
    function cust(){
      console.log(' hello every I am the custom function')
    }

    //其次,自定义一个事件
    var e = $.Event('introduce',{name:'intro',data='100'})//利用jquery的Event构造器创建了一个

    //将事件执行函数和事件对象进行绑定到某个具体的监听对象上
    $('body').bind('introduce',cust)

    //触发该事件
    $('body').trigger('introduce')


我们经常用到自定义事件是在写jquery plugin的时候,插件允许用户定义callback,然后我们在插件中根据插件的几个不同的状态来触发用户自定义的callback,我们也可以这样用:
   function cust(e){
    console.log(e.name)
    console.log("====hello I am cust function ===");
   }

   $('a').bind('cust1',cust)

   $('a').trigger({type:'cust1', test:true,name:'gao'});

分享到:
评论

相关推荐

    JQuery最佳实践之精妙的自定义事件

    Demo-Ingenious JQuery custom event JQuery最佳实践-精妙的自定义事件 问题:一个复选框X,你如何便捷地触发它的click事件的处理逻辑,但是又不改变它当前的选中状态? 答案:用自定义事件处理函数封装复选框click...

    jquery-prototype-custom-event-bridge:允许格式为“命名空间”的自定义事件

    jQuery-prototype-custom-event-bridge 测试。 允许格式为namespace:eventname自定义事件在 Prototype 和 jQuery 之间传递。 由 jQuery 触发的此类自定义事件将命中 Prototype 观察者(以及 jQuery 侦听器)。 ...

    jQuery 1.5 API 中文版

    Custom $.animate( params [, duration] [, easing] [, fn] ) $.animate( params, options ) $.stop( [clearQueue] [, jumpToEnd] ) $.delay( duration [, queueName] ) Settings booljQuery.fx.off numjQuery.fx....

    Learning jQuery 3 - Fifth Edition

    Create custom interactive elements for your web designs Find out how to create the best user interface for your web applications Use selectors in a variety of ways to get anything you want from a page...

    jquery.custom-socialbuttons:这是一个很小的 ​​jQuery 库,它有助于快速创建一些社交按钮

    jQuery-custom社交按钮这是一个很小的 ​​jQuery 库,它有助于快速创建一些社交按钮。 所有元素都可以通过插件属性进行自定义,并且库不需要外部样式表。 这已经在 Linux 上的 Firefox、Chrome 和 IE8+ 以及 ...

    jQuery.Design.Patterns.178588

    jQuery solves the problems of DOM manipulation, event detection, AJAX calls, element selection and document queries, element attribute and data management, as well as object management utilities....

    jQuery完全实例.rar

    See ready(Function) for details about the ready event. 返回值 jQuery 参数 callback (Function) : 当DOM加载完成后要执行的函数 示例 当DOM加载完成后,执行其中的函数。 jQuery 代码: $(function(){ // ...

    jquery.ajax:从jQuery提取ajax

    jquery.ajax 只能使用jQuery的与Ajax相关的功能。...grunt custom:-css,-deprecated,-dimensions,-effects,-event,-event/alias,-offset,-wrap,-core/ready,-exports/global,-exports/amd,-sizzle compare_size

    JS前台框架.rar

    04 jquery jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to ...

    slider-widget:带有Backbone事件模块的jQuery UI小部件

    slider.on('change', function() {// your custom event});更新并拆除滑块,而无需刷新页面。 slider.update({// update paramater and new value});slider.destroy();在这里找到一个简单的代码

    zepto:Zepto.js是适用于现代浏览器的简约JavaScript库,具有jQuery兼容的API

    Zepto.js –简约JavaScript库Zepto是用于现代浏览器的极简JavaScript库,具有与jQuery兼容的API... $ npm install$ npm run-script dist# do a custom build$ MODULES= " zepto event data " npm run-script dist# on

    dime:Uber-micro库(<1kb),用于选择元素和处理自定义事件。 没有依赖关系。 IE9 +

    dime.js 方法 元素= $('selector') 元素= $('selector')[0] 元素|元素.on() 元素|元素.trigger() 元素.each() 元素.find() 用法 // Select multiple elements ...// Trigger a custom event on elements.

    Popelt:Popelt - 轻量级响应动态模态弹出 jQuery 库

    轻量级响应动态模态弹出 jQuery 库 检查:和 下载:(5kb) 特征 模态 React灵敏 动态按钮 动态内容 - Ajax 、 Iframe或模板 第一个输入焦点 动态定位 逃脱关闭 多个/嵌套弹出窗口和开放堆栈处理 动态叠加背景颜色和...

    Sortable前端框架

    * No jQuery (but there is [support](#jq)) ### Articles * [Sortable v1.0 — New capabilities](https://github.com/RubaXa/Sortable/wiki/Sortable-v1.0-—-New-capabilities/) (December 22, 2014...

    Knockout API 中文版

    jQuery is an excellent low-level way to manipulate elements and event handlers in a web page. I certainly still use jQuery for low-level DOM manipulation. KO solves a different problem. 如果页面要求...

    大名鼎鼎SWFUpload- Flash+JS 上传

     custom_setting_n : "custom_setting_value_n",  }  } [编辑本段]SWFUpload中的File Object  在SWFUpload的使用过程中,无论在客户端还是服务器端都要和File Object打交道,在一个File Object中包含了以下...

    unigui0.83.5.820

    - New Demo: Basic jQuery 0.81.2.801 +---------------------------------------------------------------------------------------- - TUniScreeMask issue with borderless MainForm - Installer: Bug resolved ...

    WordPress 宝典.pdf

    Discover hooks and leverage the WordPress event-driven programming interface Create WordPress widgets in only a few minutes Explore alternate uses of WordPress Enhance your blog with WordPress MU ...

    AngularJS - Novice to Ninja.pdf.pdf )

    非常不错的书 Preface . . . . . . . . ....Who Should Read This Book ....Conventions Used ....Code Samples ....Tips, Notes, and Warnings ....Supplementary Materials .... ....Chapter 1 Falling In Love With AngularJS ....

Global site tag (gtag.js) - Google Analytics