如图所示效果:年—月—日 时—分—秒

<tr>
                <td align="center" style="background-color: #cccccc">
                    出机时间:</td>
                <td style="padding-left: 5px; background-color: #ffffff" class="style2">
                    <asp:TextBox ID="txtChuDate" runat="server"  Width="34%" onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc})"></asp:TextBox>
                    <asp:TextBox ID="txtChuHour" runat="server"  Width="12%"></asp:TextBox>:
                    <asp:TextBox ID="txtChuMin" runat="server"  Width="12%"></asp:TextBox>
                    <asp:TextBox ID="txtDate" runat="server"    Width="10%" style=" display:none"></asp:TextBox>
                    <img align="absmiddle" height="22"  onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc})" src="../My97DatePicker/skin/datePicker.gif" width="16" /></td>
                <td style="padding-left: 5px; height: 25px; background-color: #ffffff">
                    &nbsp;</td>
            </tr>
            <tr>
                <td align="center" style="height: 25px; background-color: #cccccc">
                    回机时间:</td>
                <td style="padding-left: 5px; background-color: #ffffff" class="style2">
                    <asp:TextBox ID="txtHuiDate" runat="server"  Width="34%"  onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc2})"></asp:TextBox>
                    <asp:TextBox ID="txtHuiHour" runat="server"  Width="12%"></asp:TextBox>:
                    <asp:TextBox ID="txtHuiMin" runat="server"  Width="12%"></asp:TextBox>
                    <asp:TextBox ID="txtDate2" runat="server"    Width="10%" style=" display:none"></asp:TextBox>
                    <img align="absmiddle" height="22" onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc2})"src="../My97DatePicker/skin/datePicker.gif" width="16" /></td>
                <td style="padding-left: 5px; height: 25px; background-color: #ffffff">
                    &nbsp;</td>
            </tr>

javascript操作Onpicked:PickedFunc代码

<script  type="text/javascript">
            function PickedFunc(){
            $dp.$('txtChuDate').value=$dp.cal.getP('y')+"-"+$dp.cal.getP('M')+"-"+$dp.cal.getP('d');
            $dp.$('txtChuHour').value=$dp.cal.getP('H');
            $dp.$('txtChuMin').value=$dp.cal.getP('m');
                               }
                                function PickedFunc2(){
            $dp.$('txtHuiDate').value=$dp.cal.getP('y')+"-"+$dp.cal.getP('M')+"-"+$dp.cal.getP('d');
            $dp.$('txtHuiHour').value=$dp.cal.getP('H');
            $dp.$('txtHuiMin').value=$dp.cal.getP('m');
                               }
</script>

注意:el:'txtDate'中,如果你不需要'txtDate'这个框,你可以把他隐藏,但是el属性必须指定
$dp.$和$dp.cal.getP都是内置函数

<asp:TextBox ID="txtDate" runat="server"    Width="10%" style=" display:none"></asp:TextBox>

将这个TextBox的style display属性设置为隐藏就可得到每个数据。

两个输入框联动:

第一个日期选中后自动填充到第二个日期框中

在等一个输入框的点击事件function PickedFunc() 中加入如下代码将第一个输入框中选择的val()赋值给第二个框的所有

{if ($("input[id$='txtHuiDate']").val() == "") {
                $("input[id$='txtHuiDate']").val($("input[id$='txtChuDate']").val());
                $("input[id$='txtHuiHour']").val($("input[id$='txtChuHour']").val());
                $("input[id$='txtHuiMin']").val($("input[id$='txtChuMin']").val());

MyDatePicker拆分日期显示到不同TextBox的更多相关文章

  1. iOS不得姐项目--精华模块上拉下拉的注意事项,日期显示,重构子控制器,计算cell的高度(只计算一次),图片帖子的显示

    一.上拉下拉注意事项 使用MJRefresh中的上拉控件自动设置透明 当请求下页数据通过page的时候,注意的是上拉加载更多数据失败的问题,下拉加载数据失败了,页数应该还原.或者是请求成功的时候再将页 ...

  2. ios日期显示NaN

    ios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc.安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/” var time = ne ...

  3. SilverLight:基础控件使用(4)-日期显示和选择类控件

    ylbtech-SilverLight-Basic-Control:基础控件使用(4)-日期显示和选择类控件 Calendar,DatePicker 1.A,返回顶部 Calendar控件(日期控件) ...

  4. HTML5验证及日期显示

    以前忽略了HTML5的强大功能,谁知有了它数据大部分都不需要自己验证,显示日历也不需要插件啦,一些小功能分享给大家 1.Email输入框,自动验证Email有效性. <!DOCTYPE HTML ...

  5. Highcharts使用=====通过指定日期显示曲线

    1.说明: 利用HighStock显示曲线,在右上角的日期间隔选择好日期后,重新请求后台数据,重新加载曲线. 2.实现方法: 在HighStock的rangeSelector中有一个属性inputDa ...

  6. 对Spring from中日期显示格式化问题

    开始时间 结束时间 保存 取消 想在input中让日期格式显示为HH:ss 但是各种百度没有找到答案 最后Google之 http://stackoverflow.com/questions/1173 ...

  7. js实现日期显示的一些操作

    1.js获取当前日期(yyyy-mm-dd) 以下代码是获取到的当前日期: var myDate = new Date(); var year = myDate.getFullYear(); //获取 ...

  8. MFC日期显示

    一.使用MFC的CTime类来得到时间: CTime必须调用赋值函数,使用其静态函数来初始化 例如: CTime time=CTime::GetCurrentTime(): 这样就可以直接调用time ...

  9. TOAD和PLSQL 默认日期显示、rowid显示、TNSNAME的修改

    先说下要解决的问题: select rowid,acct_id,state_date from acct; 修改后,1)sql指明rowid,可以显示出来 2)时间格式显示为YYYYMMDD HH24 ...

随机推荐

  1. A fatal error has been detected by the Java Runtime Environment:

    在Eclipse中运行项目 遇到如下错误: ## A fatal error has been detected by the Java Runtime Environment:## EXCEPTIO ...

  2. Hibernate 配置详解(9)

    hibernate.cache.use_structured_entries Hibernate文档上介绍,该属性是用于把对象以一种更易读的方式放到二级缓存中,这样,在对二级缓存进行监控的时候就更容易 ...

  3. AlertView点击确定后再执行后面的代码

    AlertView的show方法执行后,后面的代码会继续运行,而不会等待用户按键结束再走,这样,如果把弹出的代码写在一个BOOL函数里,没等用户确认直接返回NO就惨了,解决方法: - (BOOL)be ...

  4. 服务管理——ntp

    一 ntp相关知识 什么是时间同步服务器 Network Time Protocol(NTP)是用来使计算机时间同步化的一种协议,它可以使计算机对其服务器或时钟源(如石英钟,GPS等等)做同步化,它可 ...

  5. linux 命令之 uptime

    uptime 命令是用来查询linux系统负载的. 命令格式 uptime [OPTION] -V 显示版本号 不带參数的 uptime 直接输出系统负载. 何为系统负载呢? 系统平均负载被定义为在特 ...

  6. 一个C/C++结构体初始化有趣的现象

    我们知道C语言当中结构可以使用{}进行初始化,例如有结构体定义如下: typedef struct type_t { int a; int b; int c; int d; }type_t; 我们可以 ...

  7. JAVA责任链设计模式

    <JAVA与模式>之责任链模式 在阎宏博士的<JAVA与模式>一书中开头是这样描述责任链(Chain of Responsibility)模式的: 责任链模式是一种对象的行为模 ...

  8. SharePoint 计时器服务无法启动

    摘要: Microsoft SharePoint Server 2010 使用 Windows SharePoint Services 定时 V4 (SPTimerV4) 服务运行大多数系统任务.服务 ...

  9. javascript高级知识点——闭包

    代码信息来自于http://ejohn.org/apps/learn/. 先给出一个权威的定义,函数对象可以通过作用域相互关联起来,函数体内的变量可以保存在函数的作用域内,这种特性称为闭包. 在闭包内 ...

  10. Javascript 常用

    第一步,实现百度输入法的页面布局 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...