jQuery UI的datepicker没有icon图片，工作需要，自己写了一个，原理是用div包裹住datepicker的input和一个button，隐藏掉input，而button被点击后也可以触发input从而显示datepicker。

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <script src="js/jquery-1.11.3.min.js"></script>

        <script src="js/jquery-ui.min.js"></script>

        <link rel="stylesheet" href="css/jquery-ui.css" />

        <style>

            .dateCon{width:150px; height:30px; display:table-cell; vertical-align:middle; border:1px solid #eee; padding-left:5px;}

            .dateCon input[type="text"]{width:128px; height:15px; line-height:15px; font-size:15px; border:0; float:left; display:inline-block;}

            .dateCon input[type="text"]:focus{outline:none;}

            .dateCon input[type="button"]{width:20px; height:20px; float:right; display:inline-block;}

        </style>

    </head>

    <body>

        <div class="dateCon">

            <input type="text" id="datepicker1" />

            <input type="button" id="dateIcon" />

        </div>

        <script>

            $(document).ready(function(){

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

                $("#dateIcon").click(function(){

                    $("#datepicker1").trigger("focus");

                });

            });

        </script>

    </body>

</html>

用trigger触发datepicker的更多相关文章

  1. jquery trigger 触发事件小计 -- 关于a标签

    jquery -- trigger触发执行事件方法虽然好用,偶尔也会出些小问题. 在最近得一个项目中需要触发a标签的点击事件时,我就遇到了点小问题.我很想当然的写层这样:$("a" ...

  2. unity collider 和 trigger 触发条件

    物体A,物体B(都含有collider组件) collider触发条件:A和B至少一方是  未勾选is Kinematic的rigidbody,且都未勾选 is trigger.当只有一方是rigid ...

  3. jquery的自定义事件通过on绑定trigger触发

    jquery绑定自定义事件,可以实现预先绑定好一个处理方法,当需要使用的时候利用jquery trigger来触发自定义事件,以达到方便快捷的目的.我们来假设一个这样的场景,一个textarea中的字 ...

  4. JQuery的click,trigger触发a标签的click事件无效的问题分析

    今天在做一个手机端webAPP链接下载的时候,给a标签一个下载链接,但是通过 <a id="downFile" download="" href=&quo ...

  5. javascript trigger触发事件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 使用jquery trigger 触发a标签的click事件取代window.open方法

    var ohtml='<div class="friend-dialog tac pt15 pb20">'+ '<div class="f-h32&qu ...

  7. trigger(type,[data]) 在每一个匹配的元素上触发某类事件。

    trigger(type,[data]) 概述 在每一个匹配的元素上触发某类事件.大理石平台价格表 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit', ...

  8. 【jQuery】【转】jQuery中的trigger和triggerHandler区别

    trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...

  9. trigger() & bind() 使用心得

    trigger(type) 在每一个匹配的元素上触发某类事件. 返回值:jQuery 参数: type (String): 要触发的事件类型 示例: $("p").trigger( ...

随机推荐

  1. HDU 5433 Xiao Ming climbing 动态规划

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=5433 Xiao Ming climbing Time Limit: 2000/1000 MS (Ja ...

  2. lintcode-81-数据流中位数

    81-数据流中位数 数字是不断进入数组的,在每次添加一个新的数进入数组的同时返回当前新数组的中位数. 说明 中位数的定义: 中位数是排序后数组的中间值,如果有数组中有n个数,则中位数为A[(n-1)/ ...

  3. 使用 virt-install 创建虚拟机

    使用 virt-install 创建虚拟机 virt-install --help 使用 qemu-kvm 创建虚拟机 介绍 1:命令路径:/usr/libexec/qemu-kvm   2:添加至环 ...

  4. 0302思考&回答

    看完这两个网页,我们可以看出it行业始终是一门热门行业,在现在这个人潮汹涌的人才市场,面对严峻的就业形势,我们应该拿什么去参见招聘?人多而工作职位有限,这警醒我们必须拥有一技之长,否则则会被淘汰.如果 ...

  5. Scrum Meeting Beta - 4

    Scrum Meeting Beta - 4 NewTeam 2017/12/2 地点:新主楼F座二楼 任务反馈 团队成员 完成任务 计划任务 安万贺 完成了部分页面标题栏颜色的修改和字体的调整Iss ...

  6. 【第二周】Java实现英语文章词频统计

    1.需求:对于给定的英文文章进行单词频率的统计 2.分析: (1)建立一个如下图所示的数据库表word_frequency用来存放单词和其对应数量 (2)Scanner输入要查询的英文文章存入Stri ...

  7. nginx & restart

    nginx & restart https://www.cyberciti.biz/faq/nginx-linux-restart/

  8. 【Quartz.Net】.net 下使用Quartz.Net

    Quartz.net是作业调度框架 1. 项目中添加quartz.net的引用(这里使用nuget管理) 新建一个类TimingJob,该类主要用于实现任务逻辑   using Quartz; usi ...

  9. 51nod 1574 排列转换(贪心+鸽巢原理)

    题意:有两个长度为n的排列p和s.要求通过交换使得p变成s.交换 pi 和 pj 的代价是|i-j|.要求使用最少的代价让p变成s. 考虑两个数字pi和pj,假如交换他们能使得pi到目标的距离减少,p ...

  10. 【刷题】HDU 1695 GCD

    Problem Description Given 5 integers: a, b, c, d, k, you're to find x in a...b, y in c...d that GCD( ...