JavaScript插件使用筆記

1.jQuery UI日期插件 

依賴關係：jQuery UI依賴jQuery庫，jQuery UI插件依賴jQuery UI基本庫

問題：jQuery UI官網下載日期插件不能直接選擇年份，須要導入如下文件

jquery.ui.datepicker-zh-CN

jquery-ui-slide.min

jquery-ui-timepicker-addon

 

2.jQuery分頁插件

3.iscroll

4.yxMobileSlider.js

5.iosselect

//基於iscroll5
//包含文件iscroll.js/iosselect.js/iosselect.css
//github:https://github.com/zhoushengmufc/iosselect

//用法:
//建立IosSelect對象，會彈出滑動選擇框
//參數2表示兩列，array1和array2是數組，
var demo = new IosSelect(2,[array1,array2],
    {
        title: 'this is a title',
        itemHeight: 40,
        headerHeight:100,
        oneLevelId: array1,
        twoLevelId: array2,
        relation:[1],//此處設置一級和二級關聯，不關聯不需設置
        callback: function (array1, array2) {}//點擊肯定調用回調函數
    }
);

//array1形如,value是顯示的值，parentId用於關聯
var array1 = [{'id':'','value':'','parentId':''}]

6.dropload.js

//依賴jQuery
//須要引入文件jQuery.js/dropload.js/dropload.css
//用法：選取須要滑動的區域，調用dropload方法
$(".content").dropload({
    //定義上劃執行的函數
    loadUpFn:function (me) {
        $.ajax({
            url: "",
            type: "get",
            data: {},
            dataType: "json",
            success: function (data) {
                me.resetload();
            },
            error: function () {
                new Toast({message: "加載出錯，請重試！"})
                me.resetload();
            }
        });
    },
    //定義下劃執行的函數
    loadDownFn:function (me) {
    $.ajax({
        url:"",
        type:"get",
        data:{},
        dataType:"json",
        success:function (data) {
            me.resetload();
        },
        error:function () {
            new Toast({message:"加載出錯，請重試！"})
            me.resetload();
        }
    });
}
})

7.swiper.js

//包含css和js文件
var mySwiper3 = new Swiper('#menu_swiper',{
    freeMode : true,
    slidesPerView : 'auto'
});

8.toast.js

new Toast({message:'提示信息!'}).show();

插件資源:

jQuery插件庫：http://www.jq22.com/