背景:

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

代码:

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

vue中写法

 <template>
<div>
<el-row style="height:30px" type="flex">
<el-col :span="12">
<el-form-item label="开始时间" required>
<el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable
placeholder="选择日期" v-model="form.loadDate"
style="width:140px;"></el-date-picker>
<el-time-picker type="fixed-time" format="HH:mm:ss" value-format="HH:mm:ss" clearable
placeholder="选择时间" v-model="form.loadTime" style="width:120px;"
></el-time-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="结束时间" required>
<el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable
placeholder="选择日期" v-model="form.unloadDate"
style="width:140px;"></el-date-picker>
<el-time-picker type="fixed-time" format="HH:mm:ss" value-format="HH:mm:ss" clearable
placeholder="选择时间" v-model="form.unloadTime"
style="width:120px;"></el-time-picker>
</el-form-item>
</el-col>
</el-row>
</div>
</template>
<script>
//时间默认值,默认当前时间+1天
var dataCur = new Date();
var dataDef = dataCur.getFullYear() + '-' + (dataCur.getMonth() + 1) + '-' + (dataCur.getDate() + 1) export default {
data() {
return {
form: {
loadDate: dataDef,
loadTime: '8:00:00',
unloadDate: dataDef,
unloadTime: '20:00:00',
}
};
}, methods: {}, };
</script>

input 时间字段默认值的更多相关文章

  1. kettle之时间字段默认值为空或’0000-00-00’问题

    今天使用kettle从mysql导数到oracle,发现只导了7行后,数据传输就终止了,查看日志信息,报错如下: 报:Couldn't get row from result set问题. 发现从这行 ...

  2. MySQL字段默认值设置详解

    前言: 在 MySQL 中,我们可以为表字段设置默认值,在表中插入一条新记录时,如果没有为某个字段赋值,系统就会自动为这个字段插入默认值.关于默认值,有些知识还是需要了解的,本篇文章我们一起来学习下字 ...

  3. Mysql 修改字段默认值

    环境:MySQL 5.7.13 问题描述:建表的时候,users_info表的role_id字段没有默认值,后期发现注册的时候,需要提供给用户一个默认角色,也就是给role_id字段一个默认值. 当前 ...

  4. SQL Server2000导出数据时包含主键、字段默认值、描述等信息

    时经常用SQL Server2000自带的导出数据向导将数据从一台数据库服务器导出到另一台数据库服务器: 结果数据导出了,但表的主键.字段默认值.描述等信息却未能导出,一直没想出什么方法,今天又尝试了 ...

  5. MySQL设置当前时间为默认值的方法

    方法一.是用alert table语句: 复制代码代码如下: use test_db1; create table test_ta1( id mediumint(8) unsigned not nul ...

  6. mysql字段默认值不生效的问题解决(上)

    在项目中使用mybatis做为持久层框架,mysql数据库.项目上线前,DBA要求我们将每张数据库表中的字段都设置默认值和not null.之前项目中有一些insert语句是将表中所有字段都列出来,然 ...

  7. SQL修改字段默认值、获取字段默认值

    一.SQL修改字段默认值 alter table 表名 drop constraint 约束名字 说明:删除表的字段的原有约束 alter table 表名 add constraint 约束名字 D ...

  8. Sqlserver添加加字段、删除字段、修改字段类型、修改字段名、修改字段默认值

    参考:https://www.cnblogs.com/pangpanghuan/p/6432331.html 初始化表: --.添加字段 --1.1.为null alter table DataTab ...

  9. Odoo14 设置Binary字段默认值

    1 # Odoo 中的附件也就是Binary字段都是经过特殊处理的 2 # 首先是上传的时候会进行base64编码后再上传到服务器 3 # 服务器进行压缩存放在odoo文件仓库中 4 # 每个odoo ...

随机推荐

  1. [精] UBOOT2017+FIT 启动流程详尽分析

    开发环境:Nanopi-neo-plus2 软件版本:uboot-2017 软件版本:linux-4.14 买这个板子有一段时间了,并没有全身心的投入在上面,有时间了的话就搞一搞, 这篇随笔算是对这个 ...

  2. 十分钟读懂JavaScript原型和原型链

    原型(prototype)这个词来自拉丁文的词proto,意谓“最初的”,意义是形式或模型.在JavaScript中,原型的探索也有很多有趣的地方,接下来跟随我的脚步去看看吧. 原型对象释义 每一个构 ...

  3. 更改ubuntu桌面环境

    1.修改桌面环境 update-alternatives --config x-session-manager 2.卸载某一种ppa源下面的软件 sudo apt-get install ppa-pu ...

  4. PAT甲级1006水题飘过

    题目分析:由于不存在相同的两个时间(24:00:00和00:00:00不会同时存在),则我们假设两个全局变量存放到达的最早的时间和达到的最晚的时间,设置最早的初值为“23:59:59”,设置最晚的初值 ...

  5. 前端框架之Bootstrap框架

    下载地址:https://v3.bootcss.com/,下载Bootstrap3版本 下载之后把文件中不需要的文件都删掉 需要获取的样式代码,可以直接从这些地方找到,然后复制 一.HTML页面导入文 ...

  6. mysql5.7新增加用户和授权

    迁移mysql数据库,运行项目的时候发现nginx和uWSGI都配置正确,可就是网站打不开,看了log文件,发现错误: django.db.utils.OperationalError: (1044, ...

  7. map小列

    // 有关学生信息的头文件student.h代码如下 #include #include using namespace std; struct Student                    ...

  8. 【转载】C#中Convert.ToInt32方法将字符串转换为Int32类型

    在C#编程过程中,可以使用Convert.ToInt32方法将字符串或者其他可转换为数字的对象变量转换为ToInt32类型,Convert.ToInt32方法有多个重载方法,最常使用的一个方法将字符串 ...

  9. mysql 根据日期进行查询数据,没有数据也要显示空

    写这篇博客主要是记录自己在对订单进行按日期查询时使用的一种查询的方法,这里的orders是订单表,你也可以改成别的什么表对于最终数据不会造成影响,除非你那个表的数据只有几条那样就会出现查不到日期的情况 ...

  10. Nginx配置Yii:backend&frontend

    #My vlson.top project #frontend server { listen 80; server_name www.vlson.com; #charset koi8-r; set ...