zoukankan      html  css  js  c++  java
  • jquery插件

    今天研究的是jquery插件的基本写法:

    比如我打算写一个名为 ImageZoom 的插件 

    前台调用:

    <script src="ImageZoom.js"></script>
    $.ImageZoom({   imageSelector:
    ".imgBox img", //图片选择器   wrapSelector: ".list-images", //层选择器   allowCustomeZoom: true, //允许手动缩放   speed: 300,                   callback: function () {     alert(2);   },
      after:function(data){
       alert(data);
    } })

      

    ImageZoom.js 内: 

    ;(function (window, document) {
        'use strict';
        /*===========================
        ImageZoom
        ===========================*/
        $(function () {
            //进入插件
            _init();
        });
        
        
        $.ImageZoom = function (options) {
            var s=this;
            
            var defaults={
                imageSelector: null,                  //图片选择器
                wrapSelector: null,                   //层选择器
                allowCustomeZoom: true,               //允许手动缩放
                speed: 500,
                callback:function(){},                 //回调函数
           
    after:function(data){}

    };
            var opts=$.extend({}, defaults, options);   //继承默认参数,合并传进来的参数
            
            $(opts.imageSelector).on('click',function(){
                opts.callback();                        //点击图片的时候,触发回调函数
            })
        
       opts.after(data){
    data=1; //往前台传递参数
    }
    }
    function _init(){ console.log('init'); } })(window, document);

       

          模板世界(www.templatesy.com),分享最新、最全的网站模板

      有一定基础,打算写js插件的同学们应该不难理解,就不过多解释了(其实我懒)

      

      

  • 相关阅读:
    DRF分页器
    DRF版本控制
    crrm复习
    python面试题网络编程和数据库
    python基础面试题
    前端格式
    数据库基本命令
    数据库管理系统
    线程协程和进程
    IPC通信
  • 原文地址:https://www.cnblogs.com/w2xh/p/4437123.html
Copyright © 2011-2022 走看看