jQuery日期插件

1.下载jQuery日期插件，见附件。

2.导入相应的js文件和jquery源码。例如

3.制作1个from表单。

<form name="chooseDateForm" id="chooseDateForm" action="servlet/DateServlet" method="post">
                <fieldset>
                开始时间：<input name="startDate" id="startDate" class="date-pick" /><br>
                结束时间：<input name="endDate" id="endDate" class="date-pick" /><br>
                <label for="test-select">Test select:</label>
                             <select name="test-select" id="test-select" style="width: 170px">
                                <option value="1">Test SELECT </option>
                                <option value="2">Doesn't shine through</option>
                                <option value="3">Even in IE</option>
                                <option value="4">Yay!</option>
                            </select>
                <input type="submit" value="提交" />
                </fieldset>
            </form>

4.当页面加载完成后执行输入框的替换。例如：

$('.date-pick')表示选择所有class属性为date-pick的元素，也就是引用的css,在这里是

开始时间：<input name="startDate" id="startDate" class="date-pick" /><br>
结束时间：<input name="endDate" id="endDate" class="date-pick" /><br>

5.为了验证除日期输入框之外其他表单子元素是否能接受，特别加了以一个下拉列表。现在就可以在服务器端验证是否能收到数据。例如在servlet中的doPost方法中可以这样写：

String startDate = request.getParameter("startDate");
String endDate = request.getParameter("endDate");
String selectValue = request.getParameter("test-select");

String[] dateArray = new String[3];
        dateArray = startDate.split("/");
        Calendar ca = null;
        try{
            int day = Integer.parseInt(dateArray[0]);
            int month = Integer.parseInt(dateArray[1]);
            int year = Integer.parseInt(dateArray[2]);
            ca = new GregorianCalendar(year,month,day);
        }
        catch (NumberFormatException e) {
            System.out.println("日期转换错误");
            e.printStackTrace();
        }

        System.out.println(("YEAR: " + ca.get(Calendar.YEAR)));
        System.out.println(("MONTH: " + ca.get(Calendar.MONTH)));
        System.out.println(("DAY: " + ca.get(Calendar.DAY_OF_MONTH)));

jQuery日期插件相关推荐

前端jquery日期插件
分享一个前端jquery日期插件,方便自己后面需要时查找使用. 效果: 1.html demo. <!DOCTYPE html> <html lang="en"& ...
JQuery日期插件datepicker的使用
JQuery是一款非常优秀的脚本框架,其丰富的控件使用起来也非常简单,配置非常灵活.下面做一个使用日期插件datapicker的例子. 1.下载jQuery核心文件就不用说了吧,datepicker是 ...
精确到秒的JQuery日期控件，jquery日历插件，jquery日期插件
2019独角兽企业重金招聘Python工程师标准>>> 效果图如下: 首先在页面中引用一下库: <link type="text/css" href=&qu ...
jquery日期插件_AngularJS 日期时间选择组件（附详细使用方法）
插件简介 AngularJS是一款目前非常火的JavaScript脚本库,应用范围十分广阔.今天给大家分享一款基于AngularJS和jQuery的日期时间选择组件,和别的日期选择插件一样,它同样支持 ...
一款简洁大气的jquery日期日历插件
本jquery插件名为manhuaDate,暂时只支持jquery 1.9.0以下版本,比如jquery-1.8.3.min.js 查看效果网址: http://keleyi.com/a/bjad/e ...
html中字段是日期控件,jQuery日历插件datepicker用法详解
jQuery是一款不可多得的非常优秀的javascript脚本开发库,而基于其上的很多插件也是非常规范和卓越的,如果错过这番美景真是太可惜了,比如datepicker这个插件. 一般MIS系统的前端, ...
jquery mobile mobiscroll 日期插件使用mobiscroll
jquery mobile mobiscroll 日期插件使用mobiscroll 官网网站: http://www.mobiscroll.com/ http://code.google.com/p ...
Jquery日期、时间选择插件
在jquery ui中,提供了一个非常实用的日期选择器:datepicker,使用它能非常方便的展现日历中的日期,灵活配置相关选项,包括日期格式.范围等.我们经常在WEB应用中用到datepicker ...
Jquery中日期插件jquery.datepick的使用
jsp的代码: 1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 p ...

jQuery日期插件

jQuery日期插件相关推荐

最新文章

热门文章