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. 小程序解密 encryptedData 获取 unionID 等信息

    index.php <?php include_once "wxBizDataCrypt.php"; // $appid 由小程序微信官方后台获取 $appid = 'wx4 ...

  2. bootstrap心得

    最近在弄个人的博客,之前对bootstrap的使用老是感觉使用的一般 幸好在看了慕课网的一个老师的实例教程之后,才感觉是真正对前端使用bootstrap有了一点理解 首先就是. 这些标签,其实都是相当 ...

  3. (转自大富翁)LockType 属性

    指示编辑过程中对记录使用的锁定类型. 设置和返回值 设置或返回以下某个 LockTypeEnum 的值. 常量 说明 adLockReadOnly 默认值,只读.无法更改数据. adLockPessi ...

  4. 【前端学习笔记】利用iframe实现表单的无刷新提交案例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 【bzoj2669】[cqoi2012]局部极小值 容斥原理+状压dp

    题目描述 有一个n行m列的整数矩阵,其中1到nm之间的每个整数恰好出现一次.如果一个格子比所有相邻格子(相邻是指有公共边或公共顶点)都小,我们说这个格子是局部极小值. 给出所有局部极小值的位置,你的任 ...

  6. [CTSC2012]熟悉的文章 后缀自动机

    题面:洛谷 题解: 观察到L是可二分的,因此我们二分L,然后就只需要想办法判断这个L是否可行即可. 因为要尽量使L可行,因此我们需要求出对于给定L,这个串最多能匹配上多少字符. 如果我们可以对每个位置 ...

  7. 【BZOJ4889】不勤劳的图书管理员（树套树）

    [BZOJ4889]不勤劳的图书管理员(树套树) 题面 又是权限题,烦死了 洛谷真好 题解 分开考虑每一次交换产生的贡献. 假设交换\((x,y)\) 检查\(x\)与\(y\)对于区间\([x+1, ...

  8. ZJOI 2017 day2 4.27

    明天就要比赛啦,今天早点休息. 既然是随便扯,首先就是yyzx的wifi(宁波的这种wifi系统我第一次见,要打开任意一个浏览器,才能跳出界面,网还是挺快的) 上午是学车的翁伊嘉&猪猪侠讲课, ...

  9. hdu1693 Eat the Trees 【插头dp】

    题目链接 hdu1693 题解 插头\(dp\) 特点:范围小,网格图,连通性 轮廓线:已决策点和未决策点的分界线 插头:存在于网格之间,表示着网格建的信息,此题中表示两个网格间是否连边 状态表示:当 ...

  10. 洛谷 P3648 [APIO2014]序列分割 解题报告

    P3648 [APIO2014]序列分割 题目描述 你正在玩一个关于长度为\(n\)的非负整数序列的游戏.这个游戏中你需要把序列分成\(k+1\)个非空的块.为了得到\(k+1\)块,你需要重复下面的 ...