zoukankan      html  css  js  c++  java
  • input type="file"获取文件名方法

     <div class="file-box"> 
        <form id="uploadForm"> 
            <input type="text" id="textfield" class="txt" />
            <input type="button" class="btn" value="浏览..." /> 
            <input type="file" name="file" class="file" id="fileField" onchange="document.getElementById('textfield').value=this.files[0].name"/> 
            <input type="submit" class="btn" value="上传" /> 
        </form> 
    </div>
    CSS样式
    .file-box{ position:relative;width:340px;margin:20px;}
    .txt{ height:28px;line-height:28px; border:1px solid #cdcdcd; width:180px;}
    .btn{width:70px; color:#fff;background-color:#3598dc; border:0 none;height:28px; line-height:16px!important;cursor:pointer;}
    .btn:hover{background-color:#63bfff;color:#fff;}
    .file{ position:absolute; top:0; right:85px; height:30px;line-height:30px; filter:alpha(opacity:0);opacity: 0;width:254px }
    
    效果图

    只获取文件名

    document.getElementById('fileField').files[0].name

    获取带路径的文件名

    document.getElementById('fileField').value

  • 相关阅读:
    Java8新特性3 Stream
    注解
    Base64编码
    代理
    Cglib
    快照
    Java安全模式
    Hibernet缓存详解
    中文文档
    JDK1.8时间日期函数
  • 原文地址:https://www.cnblogs.com/lguow/p/12957494.html
Copyright © 2011-2022 走看看