jquery-ui-datepicker组件done

来源：互联网发布：数据安全保密管理制度编辑：程序博客网时间：2024/06/11 11:44

html-file:

<pre name="code" class="html"><html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8"><title>jQuery Datepicker</title><link href="jquery-ui.css" rel="stylesheet"><script type="text/javascript" src="jquery-1.8.1.js"></script><script type="text/javascript" src="jquery-ui.js"></script><script type="text/javascript" src="dateinput-ch-ZN.js"></script><link href="myScript.css" rel="stylesheet"></head><body><h1>jQuery Datepicker</h1><p>输入框</p><hr><script src="./myScript.js"></script>结果测试：<p id="date2"></p></body></html>

css-file:

<pre name="code" class="css">body {font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";font-size: 62.5%;}.boardDiv {width: 200px;height: 300px;}

js-file:

<pre name="code" class="javascript">function ProcessBar() {// 创建整体的divthis.boardDiv = $("<div>");this.boardDiv.addClass("boardDiv");this.date = $("<input>");this.date.datepicker({changeMonth : true,changeYear : true}); // 绑定输入框this.boardDiv.append(this.date);}ProcessBar.prototype.getDate = function() {var date = this.date.val();return date;}ProcessBar.prototype.setDate = function(date) {this.date.val(date);}var dateValue;var date = "1993-10-19";var processBar = new ProcessBar();$(document.body).append(processBar.boardDiv);processBar.setDate(date);//设置日期window.setInterval(function() {dateValue = processBar.getDate();//获取日期$("#date2").text(dateValue);}, 20);

所需插件：

<img src="http://img.blog.csdn.net/20160330092224338?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />

0 0