深入浅出golang我是程序员

76.WEB模板HTML5新对象datetime-local的使

2019-02-04  本文已影响23人  厚土火焱

在编写web界面的时候,常会用到时期时间控件的使用需求。比如,我们需要写一个时间范围的搜索条件。
在HTML5中有一个新的对象datetime-local。
html代码

        <label style="color: #8aa4be;padding-left: 2px;margin-left: 15px">时间范围</label>
        <input id="btnSearch" type="datetime-local" value="{{.keyDateBegin.Format "2006-01-02T15:04"}}" style="color: #8aa4be;padding-left: 2px;padding-right: 2px;margin-left: 1px">
        <label style="color: #8aa4be;padding-left: 2px;margin-left: 1px">-</label>
        <input id="btnSearch" type="datetime-local" value="{{.keyDateEnd.Format "2006-01-02T15:04"}}" style="color: #8aa4be;padding-left: 2px;padding-right: 2px;margin-left: 1px">

需要注意Format的格式写法

底层go代码

var data = map[string]interface{}{"keyEvent":searchEvent,"keyOperator":searchOperator,"keyDateBegin":keyDateBegin,"keyDateEnd":keyDateEnd,"dataList":dataList, "totalRecordsNum":totalRecordsNum, "totalPageNum":totalPageNum, "currentPageNum":currentPageNum, "recordsNumPerPage":recordsNumPerPage,"pageData":pageData}

无论是PC端还是手机浏览器,只要支持HTML5都可以正常使用。


image.png
image.png
image.png
上一篇 下一篇

猜你喜欢

热点阅读