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. 进阶系列（8）——匿名方法与lambda表达式

    一 匿名方法的介绍     匿名方法是为了简化委托的实现,方便调用委托方法而出现的,同时,匿名方法也是学好lambda表达式的基础.在委托调用的方法中,如果方法只被调用一次,这个时候我们就没有必要创建 ...

  2. 关于解决乱码问题的一点探索之二（涉及Unicode（utf-16）和GBK）

        在上篇日志中(链接),我们讨论了utf-8编码和GBK编码之间转化的乱码问题,这一篇我们讨论Unicode(utf-16编码方式)与GBK编码之间转换的乱码问题.     在Windows系统 ...

  3. 关于window.open弹出窗口被阻止的问题

    原文:http://blog.csdn.net/fanfanjin/article/details/6858168 在web编程过程中,经常会遇到一些页面需要弹出窗口,但是在服务器端用window.o ...

  4. Markdown语法实践

    Markdown语法实践 Markdown基本语法 1.标题 # 一级标题 ## 二级标题 ### 三级标题 eg: 一级标题 二级标题 三级标题 2.链接 标准: [Title](URL) 实例: ...

  5. PAT 甲级 1035 Password

    https://pintia.cn/problem-sets/994805342720868352/problems/994805454989803520 To prepare for PAT, th ...

  6. Windows连接Linux服务器中MySQL数据库-权限配置

    问题描述 在Windows系统中安装了监控MySQL数据库服务器性能的工具Spotlight on MySQL,利用Spotlight连接Linux服务器中的MySQL,进行相关配置如下:   点击& ...

  7. 如何在windows下Apache环境开启htaccess伪静态功能

     以下文章来自于网络,只做学习用 很多国人习惯用windows服务器或者在windows系统下调试PHP程序,在调试货使用的时候就遇到开启伪静态的各种问题,今天在网络上搜集了一些开启伪静态需要注意 ...

  8. Java Servlet简介

     一.了解Servlet的概念 Servlet定义 Servlet是基于Java技术的Web组件,由容器管理并产生动态的内容.Servlet引擎作为WEB服务器的扩展提供支持Servlet的功能.Se ...

  9. 第162天：canvas中Konva库的使用方法

    本篇接着上一篇:第157天:canvas基础知识详解  继续来写. 五.Konva的使用快速上手 5.1 Konva的整体理念 Stage | +------+------+ |            ...

  10. Asp.net MVC 获取IPv4 地址

    public static string GetIP4Address() { string IP4Address = String.Empty; foreach (IPAddress IPA in D ...