• input 时间字段默认值


    背景:

    时间字段展示默认值,开始时间为当天 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="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="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="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="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>
  • 相关阅读:
    webpack.DefinePlugin
    webpack-dev-server配置指南(使用webpack3.0)
    Eclipse配色方案插件
    解决Sublime Text 3中文显示乱码问题(转)
    Java连接SqlServer2008数据库
    [转]java中判断字符串是否为数字的三种方法
    VS2008 SP1 安装卡在 VS90sp1-KB945140-X86-CHS的解决方法
    Python获取桌面路径
    关于fdisk命令
    socket 错误之:OSError: [WinError 10057] 由于套接字没有连接并且(当使用一个 sendto 调用发送数据报套接字时)没有提供地址,发送或接收数据的请求没有被接受。
  • 原文地址:https://www.cnblogs.com/whycai/p/12040383.html
Copyright © 2020-2023  润新知