用trigger觸發datepicker

時間 2020-04-16

標籤 trigger 觸發 datepicker 简体版

原文原文鏈接

jQuery UI的datepicker沒有icon圖片，工做須要，本身寫了一個，原理是用div包裹住datepicker的input和一個button，隱藏掉input，而button被點擊後也能夠觸發input從而顯示datepicker。css

<!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>

1. 觸發器 trigger
2. Sqlite—觸發器（Trigger）
3. WPF觸發器(Trigger)
4. mysql—觸發器trigger
5. mysql 觸發器（trigger）
6. mysql之觸發器trigger
7. Oracle高級trigger觸發器
8. Oracle之觸發器(Trigger)
9. WPF觸發器(Trigger、DataTrigger、EventTrigger)
10. Mysql之觸發器Trigger
更多相關文章...
• SQLite 觸發器（Trigger） - SQLite教程
• MySQL創建觸發器（CREATE TRIGGER） - MySQL教程
• PHP開發工具
• JDK13 GA發佈：5大特性解讀

相關標籤/搜索

trigger

datepicker

觸發

datepicker&timepicker

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。