记录关于input date的问题

最新推荐文章于 2023-09-01 10:15:34 发布

Nazimei_

最新推荐文章于 2023-09-01 10:15:34 发布

阅读量465

点赞数

文章标签： css css3 html

原文链接：https://segmentfault.com/q/1010000011077801

版权

HTML 日期格式 JavaScript 样式修改前端开发

关键词由CSDN通过智能技术生成

显示的日期格式样式默认是年/月/日，改为年-月-日这种样式

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
    *{
        margin: 0;
        padding: 0;
    }
    #div{
        width: 500px;
        height: 300px;
        border: 2px solid #ccc; 
        position: absolute; 
    }
    .datebox{
        width: 150px;
        position: relative;
        height: 24px;
        margin: 100px;
    }
    #date{
        position: absolute;
        left: 1px;
        top: 1px;
        z-index: 50;
        width: 100px;
        height: 100%;
        height: 22px;        
        border: 1px solid transparent;
    }
    .mydate{
        width: 150px;
        height: 24px;
        border: 1px solid #CCC;
    }
</style>
</head>
<body>
    <div class="datebox">
        <input type="text" id="date" readonly="readonly"/>
        <input type="date" class="mydate" onchange="aaa(this)"/>
    </div>
    <script type="text/javascript">
    function aaa(obj){
        document.getElementById('date').value = obj.value;       
    }
    </script>
</body>
</html>