input date设置时间

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

这里我遇到问题是:不管我使用原始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的格式.

猜你喜欢

转载自blog.csdn.net/ljcc122/article/details/79705440