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


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 相关文章推荐
javascript concat数组累加 示例
Sep 03 Javascript
JS模拟面向对象全解(一、类型及传递)
Jul 13 Javascript
js控制页面的全屏展示和退出全屏显示的方法
Mar 10 Javascript
干货分享:让你分分钟学会javascript闭包
Dec 25 Javascript
倾力总结40条常见的移动端Web页面问题解决方案
May 24 Javascript
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
Aug 23 jQuery
VueJS事件处理器v-on的使用方法
Sep 27 Javascript
详解javascript中的变量提升和函数提升
May 24 Javascript
浅谈Vue服务端渲染框架Nuxt的那些事
Dec 21 Javascript
JS将时间秒转换成天小时分钟秒的字符串
Jul 10 Javascript
搭建Vue从Vue-cli到router路由护卫的实现
Nov 14 Javascript
Vue Element校验validate的实例
Sep 21 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
两种php调用Java对象的方法
2006/10/09 PHP
PHP技术开发技巧分享
2010/03/23 PHP
php替换超长文本中的特殊字符的函数代码
2012/05/22 PHP
php字符串分割函数explode的实例代码
2013/02/07 PHP
PHP的PSR规范中文版
2013/09/28 PHP
支持生僻字且自动识别utf-8编码的php汉字转拼音类
2014/06/27 PHP
PHP实现从远程下载文件的方法
2015/03/12 PHP
php使用for语句输出三角形的方法
2015/06/09 PHP
php实现在线通讯录功能(附源码)
2016/05/13 PHP
使用PHPMailer发送邮件实例
2017/02/15 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
jQuery+css3动画属性制作猎豹浏览器宽屏banner焦点图
2015/03/16 Javascript
javascript正则表达式中的replace方法详解
2015/04/20 Javascript
JS基于正则截取替换特定字符之间字符串操作示例
2017/02/03 Javascript
利用Node.js+Koa框架实现前后端交互的方法
2017/02/27 Javascript
在 Angular6 中使用 HTTP 请求服务端数据的步骤详解
2018/08/06 Javascript
vue 解决循环引用组件报错的问题
2018/09/06 Javascript
小程序实现列表多个批量倒计时
2021/01/29 Javascript
nodeJS与MySQL实现分页数据以及倒序数据
2020/06/05 NodeJs
jQuery实现动态操作table行
2020/11/23 jQuery
echarts饼图各个板块之间的空隙如何实现
2020/12/01 Javascript
详细解读Python中解析XML数据的方法
2015/10/15 Python
Python中最大最小赋值小技巧(分享)
2017/12/23 Python
Django 限制访问频率的思路详解
2019/12/24 Python
Django重设Admin密码过程解析
2020/02/10 Python
python代码中怎么换行
2020/06/17 Python
css3 clip实现圆环进度条的示例代码
2018/02/07 HTML / CSS
德国狗狗用品在线商店:Schecker
2017/03/17 全球购物
国外最大的眼镜网站:Coastal
2017/08/09 全球购物
年度考核评语
2014/01/19 职场文书
求职信格式要求
2014/05/23 职场文书
社区科普工作方案
2014/06/03 职场文书
2014年妇女工作总结
2014/12/06 职场文书
英雄儿女观后感
2015/06/09 职场文书
业务员管理制度范本
2015/08/06 职场文书
国产动画《万圣街》日语配音版制作决定!
2022/03/20 国漫