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. C++Primer第五版——习题答案和解析

    感谢原文博主的分享:https://blog.csdn.net/misayaaaaa/article/details/53786215 新手入门必看的书.知识是一个系统化并且相互关联的体系,零散的东西 ...

  2. Java中switch可以接收的数据类型

    Java支持的数据类型有五种 他们分别是: byte.char.short.int.enum: 以上是JDK1.6以前的版本. JDK1.7时,又增加了String, public class Tes ...

  3. HDU 5666 Segment 数论+大数

    题目链接: hdu:http://acm.hdu.edu.cn/showproblem.php?pid=5666 bc(中文):http://bestcoder.hdu.edu.cn/contests ...

  4. C#控制台应用程序

    使用C#创建控制台应用程序的基本步骤: (1)创建项目: (2)编辑C#源代码: (3)编译运行: 例题:在控制台输出“Hello world!”. 第一步:文件→新建→项目:选择“项目类型”为Vis ...

  5. [2017BUAA软工]第二次博客作业：代码复审

    〇.comment链接 https://github.com/hanayashiki/Sudoku/issues/1 一.代码复审 1.概要部分 (1)代码能符合需求和规格说明么? 经测试,对于合法输 ...

  6. 【vue】this与that 一个坑

    [转载自]:https://blog.csdn.net/qq_30378229/article/details/78429374 在Vue中this始终指向Vue,但axios中this为undefi ...

  7. 对xml的操作使用的类XElement的使用

    操作xml的类比较多,发现XElement类操作xml极其方便,下面列举一些操作方法 1.创建xml XElement xml = new XElement("root", new ...

  8. bzoj1031-字符加密

    环的问题,经典方法倍长串,求出后缀数组,扫一次sa,如果sa[i]小于等于n,那么就输出这个字符串结尾的位置(即s[sa[i]+n-1]). 代码 #include<cstdio> #in ...

  9. React Native工程中TSLint静态检查工具的探索之路

    建立的代码规范没人遵守,项目中遍地风格迥异的代码,你会不会抓狂? 通过测试用例的程序还会出现Bug,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...

  10. BZOJ5314 [Jsoi2018]潜入行动 【背包类树形dp】

    题目链接 BZOJ5314 题解 设\(f[i][j][0|1][0|1]\)表示\(i\)为根的子树,用了\(j\)个监测器,\(i\)节点是否被控制,\(i\)节点是否放置的方案数 然后转移即可 ...