您的位置：首页 > 编程技术 > js  >  设置点击文本框或图片弹出日历控件的实现代码

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

 更新时间：2016年5月14日 10:00  点击：2427 
<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" );
}

});

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

[!--infotagslink--]

相关文章

  • 使用PHP+JavaScript将HTML页面转换为图片的实例分享

    这篇文章主要介绍了使用PHP+JavaScript将HTML元素转换为图片的实例分享,文后结果的截图只能体现出替换的字体,也不能说将静态页面转为图片可以加快加载,只是这种做法比较interesting XD需要的朋友可以参考下...2016-04-19

  • 利用JS实现点击按钮后图片自动切换的简单方法

    下面小编就为大家带来一篇利用JS实现点击按钮后图片自动切换的简单方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2016-10-25

  • js实现上传图片及时预览

    这篇文章主要为大家详细介绍了js实现上传图片及时预览的相关资料，具有一定的参考价值，感兴趣的朋友可以参考一下...2016-05-09

  • js实现文本框输入文字个数限制代码

    这篇文章主要介绍了js实现文本框输入文字个数限制代码，文本框输入的文字个数并不是无限制的，一般都会限定一个输入最高上限，如何限制，请看本文...2015-12-27

  • JS实现图片的不间断连续滚动的简单实例

    下面小编就为大家带来一篇JS实现图片的不间断连续滚动的简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2016-06-12

  • JS实现网页游戏中滑块响应鼠标点击移动效果

    本文实例讲述了JS实现网页游戏中滑块响应鼠标点击移动效果。分享给大家供大家参考，具体如下：这是网页游戏中的一个有趣效果，可以完成以下几个动作：滚动、scroll 8个方向、鼠标坐标获娶对象上下左右位置获取，大家可以自己添...2015-10-21

  • JavaScript判断图片是否已经加载完毕的方法汇总

    在网上有很多关于判断图片是否已经加载完毕的文章，但是有的浏览器并不适合，下面小编给大家分享一些有关JavaScript判断图片是否已经加载完毕的方法汇总，需要的朋友参考下...2016-02-12

  • 基于jquery实现图片放大功能

    这篇文章主要为大家详细介绍了基于jquery实现图片放大功能的相关资料，具有一定的参考价值，感兴趣的朋友可以参考一下...2016-05-09

  • uploader秒传图片到服务器完整代码

    这篇文章主要为大家详细介绍了uploader秒传图片到服务器的完整代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2017-04-27

  • JavaScript判断按钮被点击的方法

    javascript代码判断按钮是否被点击了在项目中经常会遇到这个需求，今天小编抽点时间给大家分享一段代码关于javascript判断按钮是否被点击的方法，感兴趣的朋友一起学习吧...2015-12-14

  • jQuery制作图片旋转效果

    本文主要介绍了jQuery制作图片旋转效果的示例代码。具有很好的参考价值，下面跟着小编一起来看下吧...2017-02-08

  • javascript特殊日历控件分享

    这篇文章主要为大家详细介绍了javascript特殊日历控件的使用方法，展示了javascript日历控件实现效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2016-03-09

  • 微信小程序点击滚动到指定位置的实现

    这篇文章主要介绍了微信小程序点击滚动到指定位置的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2020-05-23

  • 用jmSlip编写移动端顶部日历选择控件

    这篇文章主要为大家详细介绍了利用jmSlip编写移动端顶部日历选择组件的方法,具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2016-10-25

  • php图片添加文字水印实现代码

    这篇文章主要为大家详细介绍了php图片添加文字水印实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2016-03-17

  • js实现图片360度旋转

    本文主要介绍了js实现图片360度旋转的思路与方法。具有很好的参考价值，下面跟着小编一起来看下吧...2017-01-26

  • input 点击事件无效 [Element Migrating][ElInput][Event]: click is removed.

    点击无效 解决办法：可以使用 v-on 的修饰符 .native。例如：@click.native="getContentData(item)" <el-input v-for="(item,index) in voiceRetrievalData.oldContent"...2022-09-21

  • JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法

    多网站的需要填写的文本框在默认状态下都会给出一个默认的提示语言，当鼠标点击此文本框的时候能够将里面的默认文本清除，当删除输入的文本且焦点离开文本框的时候再将默认的文本写入文本框...2016-01-14

  • HTML5实现移动端点击翻牌功能

    这篇文章主要介绍了HTML5实现移动端点击翻牌功能,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2020-12-08

  • JS判断键盘是否按的回车键并触发指定按钮点击操作的方法

    下面小编就为大家带来一篇JS判断键盘是否按的回车键并触发指定按钮点击操作的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2017-02-19