码迷,mamicode.com
首页 > 其他好文 > 详细

input 时间字段默认值

时间:2019-12-14 19:03:13      阅读:82      评论:0      收藏:0      [点我收藏+]

标签:mat   default   width   star   rip   clear   日期   label   data   

背景:

时间字段展示默认值,开始时间为当天 0点,结束时间为当天晚上12点

 

代码:

 1 <input style="Width: 180px;float:left ;" type="date" id="start_time"
 2  name="start_time" placeholder="请选择具体时间"   data-format="YYYY-MM-DD HH:mm"/>
 3 <input style="Width: 180px;float:left ;" type="date" id="end_time"
 4  name="end_time" placeholder="请选择具体时间"  data-format="YYYY-MM-DD HH:mm"/>
 5 
 6 <script type="text/javascript">
 7     //时间默认值,默认当前时间
 8     var dataCur = new Date();
 9     var dataYMD = dataCur.getFullYear() + - + (dataCur.getMonth() + 1) + - + (dataCur.getDate())
10     var dataStart = dataYMD+ 00:00
11     var dataEnd = dataYMD+ 23:59
12     $(#start_time).val(dataStart);
13     $(#end_time).val(dataEnd);
14     </script>

 

vue中写法

 1 <template>
 2     <div>
 3         <el-row style="height:30px" type="flex">
 4             <el-col :span="12">
 5                 <el-form-item label="开始时间" required>
 6                     <el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable
 7                                     placeholder="选择日期" v-model="form.loadDate"
 8                                     style="width:140px;"></el-date-picker>
 9                     <el-time-picker type="fixed-time" format="HH:mm:ss" value-format="HH:mm:ss" clearable
10                                     placeholder="选择时间" v-model="form.loadTime" style="width:120px;"
11                     ></el-time-picker>
12                 </el-form-item>
13             </el-col>
14             <el-col :span="12">
15                 <el-form-item label="结束时间" required>
16                     <el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable
17                                     placeholder="选择日期" v-model="form.unloadDate"
18                                     style="width:140px;"></el-date-picker>
19                     <el-time-picker type="fixed-time" format="HH:mm:ss" value-format="HH:mm:ss" clearable
20                                     placeholder="选择时间" v-model="form.unloadTime"
21                                     style="width:120px;"></el-time-picker>
22                 </el-form-item>
23             </el-col>
24         </el-row>
25     </div>
26 </template>
27 <script>
28     //时间默认值,默认当前时间+1天
29     var dataCur = new Date();
30     var dataDef = dataCur.getFullYear() + - + (dataCur.getMonth() + 1) + - + (dataCur.getDate() + 1)
31 
32     export default {
33         data() {
34             return {
35                 form: {
36                     loadDate: dataDef,
37                     loadTime: 8:00:00,
38                     unloadDate: dataDef,
39                     unloadTime: 20:00:00,
40                 }
41             };
42         },
43 
44 
45         methods: {},
46 
47     };
48 </script>

input 时间字段默认值

标签:mat   default   width   star   rip   clear   日期   label   data   

原文地址:https://www.cnblogs.com/whycai/p/12040383.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!