欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

input date设置时间

程序员文章站 2022-05-21 21:04:32
...

ATM_之交易记录查询过程中遇到一问题。如下图,通常在页面初始化的时候我们都希望时间选中框,和下拉选择框有初始值(重点是时间初始化);
input date设置时间

这里我遇到问题是:不管我使用原始js还是jQ都不能给默认值。代码如下

简单html部分,可以自行设计css(这都不是重点)

<!-- 查询条件 -->
    <div id="query">
        <form action="">
            <div class="title">交易记录查询</div>
            <span class="f_sp">选择查询时间</span>
                <input  type="date" id="datetime" class="f_ip" required="required" >
            <span class="f_sp">选择交易类型 </span>
            <select class="f_ip"  id="type">
                <option>请选择</option>
                <option>取款</option>
                <option>存款</option>
                <option>转账</option>
            </select>
            <input type="button" id="btn_submit" class="f_sbm f_ip" value="查询"> 
        </form>
    </div>

js部分(重点部分)

//这里是通过后台传递的初始时间参数,你测试可以不需要
//var time =  $("#htime").html();
//console.log(time);
//有问题部分
    $("#datetime").val("2015/02/09");
    $('#datetime').attr('value','2015/12/09');
    document.getElementById("datetime").value = "2015/02/09";

    //document.getElementById('htime').valueAsDate=new Date();
//正确部分
    $("#datetime").val("2015-02-09");
    $('#datetime').attr('value','2015-12-09');
    document.getElementById("datetime").value = "2015-02-09";

值得注意的是:input type 时间类型可以有一下几种方式
“date”、“week”、“month”、“time”、“datetime”和“datetime-local”。

本次设置date初始化时间问题比较简单,但是容易出现初始化不了的情况,这里时间最好不使用2018/03/16的格式,而采用2018-03-16的格式.