设置点击文本框或图片弹出日历控件的实现代码


Posted in Javascript onMay 12, 2016
<input id="startDate" value="" readonly="true" type="text" style="cursor: pointer" class="user_datepicker ">
<input class="canlderImg" data-tag="start" type="image" src="../../i/canlder1.png">
<span>结束:</span>
<input id="endDate" value="" readonly="true" type="text" style="cursor:pointer;" class="user_datepicker">
<input class="canlderImg" data-tag="end" type="image" src="../../i/canlder1.png" >

// js代码

$("#startDate").datepicker();

$("#endDate").datepicker();

//点击图片弹出日历控件则需要给图片绑定点击事件
$(.canlderImg).on("click",function(e){

var tag=$(e.target).attr("data-tag");
if(tag=="start"){
  $("#startDate").datepicker( "show" );
}else if(tag=="end"){
  $("#endDate").datepicker( "show" );
}

});

以上这篇设置点击文本框或图片弹出日历控件的实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在IE模态窗口中自由查看HTML源码的方法
Mar 08 Javascript
用jscript实现列出安装的软件列表
Jun 18 Javascript
jquery 图片预加载 自动等比例缩放插件
Dec 25 Javascript
jQuery AJAX 调用WebService实现代码
Mar 24 Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 Javascript
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)
May 06 Javascript
jQuery中attr()与prop()函数用法实例详解(附用法区别)
Dec 29 Javascript
jQuery基于toggle实现click触发DIV的显示与隐藏问题分析
Jun 12 Javascript
Bootstrap前端开发案例一
Jun 17 Javascript
使用原生js写ajax实例(推荐)
May 31 Javascript
Angular4开发解决跨域问题详解
Aug 28 Javascript
vue-router命名路由和编程式路由传参讲解
Jan 19 Javascript
Bootstrap3制作图片轮播效果
May 12 #Javascript
JS创建事件的三种方法(实例代码)
May 12 #Javascript
jQuery判断checkbox选中状态
May 12 #Javascript
Bootstrap3制作自己的导航栏
May 12 #Javascript
基于Bootstrap重置输入框内容按钮插件
May 12 #Javascript
jquery ajax局部加载方法详解(实现代码)
May 12 #Javascript
分享12个非常实用的JavaScript小技巧
May 11 #Javascript
You might like
两级联动select刷新后其值保持不变的实现方法
2014/01/27 PHP
php实现smarty模板无限极分类的方法
2015/12/07 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
php生成与读取excel文件
2016/10/14 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
php检查函数必传参数是否存在的实例详解
2017/08/28 PHP
tp5修改(实现即点即改)
2019/10/18 PHP
jQuery Flash/MP3/Video多媒体插件
2010/01/18 Javascript
有关DOM元素与事件的3个谜题
2010/11/11 Javascript
关于全局变量和局部变量的那些事
2013/01/11 Javascript
js 用CreateElement动态创建标签示例
2013/11/20 Javascript
js获取form表单所有数据的简单方法
2016/08/18 Javascript
全面解析node 表单的图片上传
2016/11/21 Javascript
微信小程序之小豆瓣图书实例
2016/11/30 Javascript
如何利用JQuery实现从底部回到顶部的功能
2016/12/27 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
2017/04/27 jQuery
vue 组件高级用法实例详解
2018/04/11 Javascript
react native 仿微信聊天室实例代码
2019/09/17 Javascript
[04:19]DOTA2亚洲邀请赛 现场花絮
2015/03/11 DOTA
python从入门到精通(DAY 2)
2015/12/20 Python
pandas对指定列进行填充的方法
2018/04/11 Python
Python代码打开本地.mp4格式文件的方法
2019/01/03 Python
pytorch 加载(.pth)格式的模型实例
2019/08/20 Python
利用python-docx模块写批量生日邀请函
2019/08/26 Python
python实现文字版扫雷
2020/04/24 Python
pycharm全局搜索的具体步骤
2020/07/28 Python
利用django创建一个简易的博客网站的示例
2020/09/29 Python
python实现图书馆抢座(自动预约)功能的示例代码
2020/09/29 Python
香港通票:Hong Kong Pass
2019/02/26 全球购物
教学个人的自我评价分享
2014/02/16 职场文书
大学生入党推荐书范文
2014/05/17 职场文书
会计求职信
2014/05/29 职场文书
电子信息工程专业自荐书
2014/06/24 职场文书
我的未来不是梦演讲稿
2014/09/02 职场文书
科学发展观标语
2014/10/08 职场文书
读《方与圆》有感:交友方圆有度
2020/01/14 职场文书