文件上传

最新推荐文章于 2024-02-29 11:08:48 发布

前端路上迷茫的小鲨鱼

最新推荐文章于 2024-02-29 11:08:48 发布

阅读量125

点赞数

分类专栏： css

本文链接：https://blog.youkuaiyun.com/Guoyu1_/article/details/87872233

版权

css 专栏收录该内容

23 篇文章

订阅专栏

<a href="javascript:;" style="background: #8492af; color: #ffff; width: 100px; display: block; text-align: center;  line-height: 40px;   height: 40px;   overflow: hidden;">营业执照.jpg
    <input type="file" name="file" class="fileBox" style=" height: 40px;margin-top: -40px; filter: alpha(opacity=0);opacity: 0;">
</a>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .labela{
            position: relative;
        }
        #fileinp{
            position: absolute;
            left: 0;
            top: 0;
            opacity: 0;
        }
        #btn{
            margin-right: 5px;
        }
        #text{
            color: red;
        }

    </style>
    <script src="js/jquery-1.11.1.min.js"></script>
</head>
<body>
<label class="labela" for="fileinp">
    <input type="button" id="btn" value="点我上传"><span id="text">请上传Word文档</span>
    <input type="file" id="fileinp">
</label>
<script>
    $("#fileinp").change(function () {
        $("#text").html($("#fileinp").val());
    })

</script>
</body>
</html>