inputtex框中用JavaScript的日历提示,多处调用

同事问了我这个问题,把我搞蒙了。那就是文本框中多处调用JS的日历提示。

而那个JS也是通过项目组发给大家的,也不知道是谁写的。没办法,直接拿来用。

要实现的效果如下: 

即在“合同起始时间”和“合同期满时间”这两个对应的 input里面都调用到 JS

而这行拿来时的原代码是:

[quote]

<tr>
              <td class="tdLabel">日期:</td>
              <td class="tdText"><input type="text" id="dateinput" value="请输入日期">
              <script type="text/javascript" charset="utf-8">
              jQuery(function($){
              $("#dateinput").datepicker();
              $("#dateinput").setDefaults({showOn: 'both', buttonImageOnly: true, buttonImage: 'images/calendar.gif', buttonText: 'Calendar'});
              });
              </script>
              </td>
            </tr>

[/quote]

修改后,将JS代码放到Head部分,给其增加一个input 的变量,代码如下:

[quote]

<script type="text/javascript" charset="utf-8">
              jQuery(function($){
              $("#dateinput,#dateinput2").datepicker();
              $("#dateinput,#dateinput2").setDefaults({showOn: 'both', buttonImageOnly: true, buttonImage: 'images/calendar.gif', buttonText: 'Calendar'});
              });
              </script>

[/quote]

使用部分的代码:

[quote]

<tr>
                  <td class="tdLabel">合同起始时间</td>
                    <td class="tdText"><input type="text" id="dateinput" value="请输入日期" οnclick="">
            
              </td>
            </tr>
            <tr>
                  <td class="tdLabel">合同期满时间</td>
              <td class="tdText"><input type="text" id="dateinput2" value="请输入日期" οnclick="">
                            </td>
            </tr>

[/quote]

 

与ID相对应!

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Js双日历控件,在一个网页上同时显示两个日期选择器,写成了封装类,方便使用者调用。同时美化的相当不错。   包括了以下函数:   1、2012——2020年节假日信息(包括节假日前1~3天/后1~3天)   2、格式化数字,不足两位前面补0   3、将日期对象/日期字会串格式化为指定日期字符串   4、将日期字符串格式化为数字   5、获取目标元素针对于文档的位置   6、元素选择器   7、查找元素位置   8、判断目标元素是否包含指定的className      关于一些日历调用的参数说明:Calendar({    id: "#J_date_1", //触发显示日历元素ID    isPopup: !0, //弹出式日历    isPrevBtn: !0, //显示上月按钮    isNextBtn: !0, //显示下月按钮    isCloseBtn: !0, //显示关闭按钮    isHoliday: !0, //节假日特殊显示    isHolidayTips: !0, //显示节假日1~3天/后1~3天信息    isDateInfo: !0, //显示日期信息    isMessage: !0, //有日历提示信息    isCalStart: !0, //标记为开始时间    dateInfoClass: "date-info-start", //开始时间icon样式    range: {mindate: "2011-09-01", maxdate: "2020-12-31"},//限制范围(当天——2020-12-31)    count: 2, //日历个数    monthStep: 1, //切换上下月日历步长    onSelectDate: fnSelectDate, //选择日期回调方法    onClose: fnClose //关闭日历回调方法
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值