layui前段框架日期控件使用方法詳解
本文實(shí)例為大家分享了layui-日期控件的實(shí)現(xiàn)代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>日期</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
<blockquote class="layui-elem-quote">目前Layui中的日期組件還是layDate 1.1的改良版,它后續(xù)將會(huì)進(jìn)行一次重寫(xiě)。</blockquote>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>順便列舉幾個(gè)常用例子</legend>
</fieldset>
<div class="layui-form-pane" style="margin-top: 15px;">
<div class="layui-form-item">
<label class="layui-form-label">范圍選擇</label>
<div class="layui-input-inline">
<input class="layui-input" placeholder="開(kāi)始日" id="LAY_demorange_s">
</div>
<div class="layui-input-inline">
<input class="layui-input" placeholder="截止日" id="LAY_demorange_e">
</div>
</div>
</div>
<script src="layui/layui.js"></script>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
var start = {
min: laydate.now()
,max: '2099-06-16 23:59:59'
,istoday: false
,choose: function(datas){
end.min = datas; //開(kāi)始日選好后,重置結(jié)束日的最小日期
end.start = datas //將結(jié)束日的初始值設(shè)定為開(kāi)始日
}
};
var end = {
min: laydate.now()
,max: '2099-06-16 23:59:59'
,istoday: false
,choose: function(datas){
start.max = datas; //結(jié)束日選好后,重置開(kāi)始日的最大日期
}
};
document.getElementById('LAY_demorange_s').onclick = function(){
start.elem = this;
laydate(start);
}
document.getElementById('LAY_demorange_e').onclick = function(){
end.elem = this
laydate(end);
}
});
</script>
</body>
</html>
效果圖:

官網(wǎng)日期控件
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Jquery幻燈片特效代碼分享 打開(kāi)頁(yè)面隨機(jī)選擇切換方式(3)
jQuery是一個(gè)非常優(yōu)秀的 JavaScript 框架,使用簡(jiǎn)單靈活,一個(gè)漂亮的幻燈片更能吸引訪客的注意力。本文實(shí)例講述了jQuery實(shí)現(xiàn)時(shí)尚漂亮的幻燈片特效,基本能滿足你在網(wǎng)頁(yè)上使用幻燈片(焦點(diǎn)圖)效果。分享給大家供大家參考。具體如下:2015-08-08
jquery中dom操作和事件的實(shí)例學(xué)習(xí)-表單驗(yàn)證
這個(gè)demo的效果是實(shí)現(xiàn)用戶輸入時(shí)提供實(shí)時(shí)提醒,并不一定要等到元素失去焦點(diǎn)時(shí)才提醒2011-11-11
jQuery EasyUI API 中文文檔 - ValidateBox驗(yàn)證框
jQuery EasyUI API 中文文檔 - ValidateBox驗(yàn)證框,使用jQuery EasyUI的朋友可以參考下。2011-10-10
jQuery無(wú)刷新上傳之uploadify簡(jiǎn)單代碼
項(xiàng)目需要實(shí)現(xiàn)一個(gè)無(wú)刷新批量文件上傳功能,仔細(xì)研究了下,發(fā)現(xiàn)JQuery 提供的Uploadify插件十分不錯(cuò),有興趣的可以了解一下。2017-01-01
jQuery多媒體插件jQuery Media Plugin使用詳解
這篇文章主要介紹了jQuery多媒體插件jQuery Media Plugin使用詳解,需要的朋友可以參考下2014-12-12
使用element-ui的el-menu導(dǎo)航選中后刷新頁(yè)面保持當(dāng)前選中狀態(tài)
這篇文章主要介紹了使用element-ui的el-menu導(dǎo)航選中后刷新頁(yè)面保持當(dāng)前選中狀態(tài),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-07-07

