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


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 相关文章推荐
JS验证日期的格式YYYY-mm-dd 具体实现
Jun 29 Javascript
JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)
Oct 17 Javascript
深入理解JavaScript系列(30):设计模式之外观模式详解
Mar 03 Javascript
举例详解JavaScript中Promise的使用
Jun 24 Javascript
jquery实现根据浏览器窗口大小自动缩放图片的方法
Jul 17 Javascript
jQuery实现动态添加和删除一个div
Aug 12 Javascript
window.location.hash知识汇总
Nov 09 Javascript
基于zepto的移动端轻量级日期插件--date_picker
Mar 04 Javascript
js获取Html元素的实际宽度高度的方法
May 19 Javascript
vue.js树形组件之删除双击增加分支实例代码
Feb 28 Javascript
区别JavaScript函数声明与变量声明
Sep 12 Javascript
Vue图片裁剪组件实例代码
Jul 02 Vue.js
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
PHP中time(),date(),mktime()区别介绍
2013/09/28 PHP
解决PhpMyAdmin中导入2M以上大文件限制的方法分享
2014/06/06 PHP
javascript设计模式之解释器模式详解
2014/06/05 Javascript
Javascript基础教程之变量
2015/01/18 Javascript
浅谈javascript中new操作符的原理
2016/06/07 Javascript
JS简单随机数生成方法
2016/09/05 Javascript
使用JS实现图片展示瀑布流效果的实例代码
2016/09/12 Javascript
深入理解Javascript箭头函数中的this
2017/02/13 Javascript
JS倒计时实例_天时分秒
2017/08/22 Javascript
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
2017/09/20 jQuery
基于vue.js 2.x的虚拟滚动条的示例代码
2018/01/23 Javascript
node实现基于token的身份验证
2018/04/09 Javascript
如何编写一个d.ts文件的步骤详解
2018/04/13 Javascript
JS实现二维数组横纵列转置的方法
2018/04/17 Javascript
webpack分离css单独打包的方法
2018/06/12 Javascript
vue项目前端知识点整理【收藏】
2019/05/13 Javascript
[46:59]完美世界DOTA2联赛PWL S2 GXR vs Ink 第二场 11.19
2020/11/20 DOTA
Python基于Tkinter实现的记事本实例
2015/06/17 Python
详解Python中映射类型(字典)操作符的概念和使用
2015/08/19 Python
Python字符编码判断方法分析
2016/07/01 Python
python xml解析实例详解
2016/11/14 Python
Python中Django 后台自定义表单控件
2017/03/28 Python
python django框架中使用FastDFS分布式文件系统的安装方法
2019/06/10 Python
Python Handler处理器和自定义Opener原理详解
2020/03/05 Python
Jupyter notebook运行Spark+Scala教程
2020/04/10 Python
tensorflow使用L2 regularization正则化修正overfitting过拟合方式
2020/05/22 Python
CSS3 :default伪类选择器使用简介
2018/03/15 HTML / CSS
英国一家专门出售品牌鞋子的网站:Allsole
2016/08/07 全球购物
单位门卫岗位职责
2013/12/20 职场文书
全陪导游欢迎词
2014/01/17 职场文书
小学数学国培感言
2014/03/10 职场文书
工地安全质量标语
2014/06/07 职场文书
中职生求职信
2014/07/01 职场文书
常住证明范本
2015/06/23 职场文书
奖学金申请书(范文)
2019/08/14 职场文书
《工作是最好的修行》读后感3篇
2019/12/13 职场文书