jQuery使用之（三）

jQuery 的插件

 

一，jQuery UI

 

jQuery官网：https://jqueryui.com/

jQuery中文网：http://www.jqueryui.org.cn/

jQuery学习网：http://www.runoob.com/jqueryui/jqueryui-use.html

 

下面是一个对话框的应用例子：

 

    
    
    
    
    
    
    


    用户姓名：

    用户年龄：

    用户性别：

    
    

        
12
        

        

    

 

 

 

二，日历插件

 

 

my97Date插件官网：http://www.my97.net/

 

示例：

 

 

 

my97的常用属性

 

属性	类型	默认值	说明
el	string	null	指定一个控件的id，存储日期显示值
doubleCalendar	bool	false	双月模式，设为ture，弹出2个月日期框
dateFmt	string	yyyy-MM-dd	日期显示格式
realDateFmt	string	yyyy-MM-dd	计算机识别，正真日期格式，建议使用默认值
realTimeFmt	string	HH：mm：ss	同上
minDate	string	1900-01-01 00：00：00	最下日期（要与上面的realDateFmt匹配）
maxDate	string	2099-12-31 23：59：59	最大日期（要与上面的realDateFmt匹配）
firstDayOfWeek	int	0	周的第一天，0表示星期日
isShowWeek	bool	false	是否显示周
highLineWeekDay	bool	true	是否高亮显示周六、日
isShowClear	bool	true	是否显示清空按钮
isShowOK	bool	true	是否显示确定按钮
isShowTaday	bool	true	是否显示今天按钮

 

用法举例：

 

第一天显示了星期一，确定按钮也没有了

 

my97 的动态变量

%y：当前年

%M：当前月

%d： 当前日

%ld：本月最后一天

%H：时

%m：分

%s：秒

{ }：运算表达式，比如   {%d + 15}   当前日到后15天内

#F（自定义函数）

my97内置函数   $dp.$D()

 

下面利用自定义函数模拟买票软件，选择当前日期后，返程的日期按选择的日期开始计算

 

 

出发日期也是只能选择后20天，当年选择好出发日期后，返程的开始日期就是你选的出发日期开始算

 

 

 

实现选择日期，触发返程日期的焦点事件，就需要my97的事件函数来实现了

 

my97的事件函数

 

--onpicking     选择日期时，触发的事件

--onpicked      选择日期后，触发的事件

--onclearing    清除已选日期时，触发的事件

--oncleared     清除已选日期后，触发的事件

 

 

事件对象：dp

 

--dp.cal.getDateStr()          返回选择前的日期对象格式化值

--dp.cal.getNewDateStr()   返回选择后的日期对象格式化值