jquery插件

一、jq插件

    1、js、jquery、jquert插件的关系

   js是最原生态的脚本语言

       jquery是对js常用功能进行封装、组合、优化、简化

       jquery插件是利用jquery开发出的实用功能

    2、实用jquery插件的总体思路

       A、引入jq类库文件

       B、有必要时引入插件的CSS文件

       C、引入插件的js文件

       D、按照开发所者提供的插件说明文档或者参照DEMO取操作

    3、jquery插件实例(layer.layui.com)

       A、网上去搜索,非常多,很多都是免费的,都提供原代码。

       B、layer:弹框插件

          (1) 下载jquery插件,并解压。

          (2) 把解压的layer目录直接复制到项目当中。

              a、引入jq类库

              b、引入插件的jq文件

              c、引入项目本身的jq文件

              ** 三者顺序不可颠倒。

              Ⅰ:layer.alert("弹出内容",{

                     title:"弹窗标题",

                     icon:2                            //1~7的7钟图标,图标根据个人喜好可修改CSS来到目的。

                     skin:"layui-layer-molv"    //弹窗颜色变为墨绿色

                  },function(){

                     alert("点击确定之后处理的内容:回调函数");

                  });

              Ⅱ:layer.cinfirm("你确认删除吗?",{

                     title:"弹窗标题",

                     icon:4                  

                     skin:"layui-layer-molv"  

                  },function(){

                     alert("点击确定之后处理的内容:回调函数");   //由于有两个按钮,所以有两个回调函数

                  },function(){

                     alert("点击取消之后处理的内容:回调函数");

                  });

              Ⅲ:layer.msg("恭喜你注册成功!",{

                     title:"弹窗标题",

                     icon:4                  

                     skin:"layui-layer-molv"  

                     time:5000                    //默认3秒钟消失,本例5秒消失

                  });

              Ⅳ:layer.open({

                     type:1,                        //0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)

                     area:["390","300"]",

                     title:"弹出框标题",               

                     content:$("#d1")          //弹出窗中显示的内容,本例中是显示ID为d1的div里面的内容。

                  });

       B、jplayer:音频视频播放插件

       C、ECharts:报表插件(http://echarts.baidu.com/doc/example.html)

    

原文地址:https://www.cnblogs.com/huang3/p/4916050.html