zoukankan      html  css  js  c++  java
  • 文件上传动态获取文件名

    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>

    <body>
        <input type="file" multiple="multiple" id="test">
        <ul id='filetext'></ul>
    </body>
    <script>
    var test = document.getElementById('test');
    test.addEventListener('change', function() {
        var t_files = this.files;
        console.log(t_files);
        var str = '';
      for (var i = 0, len = t_files.length; i < len; i++) {
            console.log(t_files[i]);
            str += '<li>名称:' + t_files[i].name + ',大小:' + t_files[i].size / 1024 + 'KB</li>';
            //str +=t_files[i].name+" ";    // 换行
        };
        document.getElementById('filetext').innerHTML = str;
    }, false);
    </script>

    </html>
    ------------------------------------------------------------------------------------------------------------------------------

    #1.文件名动态显示在textarea中

    <textarea id="filetext"  name="fileName" th:text="${CloudPollingDto.fileName}"
                style="175px;height:100px;"></textarea>

    ------------------------------------------------------------------------------------------------------------------------------

    #2 <textarea name="fileName" id="ar1" cols="20" rows="3">textarea的value值是在这里的</textarea> 
    <script language="javascript">
    document.getElementById("ar1").value="这样就可以了";
    </script>

    ------------------------------------------------------------------------------------------------------------------------------

    #3.限制上传文件大小

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
    var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
    function fileChange(target,id) {
    var fileSize = 0;
    var filetypes =[".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"];
    var filepath = target.value;
    var filemaxsize = 1024*2;//2M
    if(filepath){
    var isnext = false;
    var fileend = filepath.substring(filepath.indexOf("."));
    if(filetypes && filetypes.length>0){
    for(var i =0; i<filetypes.length;i++){
    if(filetypes[i]==fileend){
    isnext = true;
    break;
        }
      }
    }
    if(!isnext){
    alert("不接受此文件类型!");
    target.value ="";
    return false;
      }
    }else{
    return false;
      }
    if (isIE && !target.files) {
    var filePath = target.value;
    var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
    if(!fileSystem.FileExists(filePath)){
    alert("附件不存在,请重新输入!");
    return false;
      }
    var file = fileSystem.GetFile (filePath);
    fileSize = file.Size;
      } else {
    fileSize = target.files[0].size;
      }

    var size = fileSize / 1024;
    if(size>filemaxsize){
    alert("附件大小不能大于"+filemaxsize/1024+"M!");
    target.value ="";
    return false;
    }
    if(size<=0){
    alert("附件大小不能为0M!");
    target.value ="";
    return false;
      }
    }
    </script>
    </head>
    <body>
    <input type="file" name="contractFileName" style=" 500px;" onchange="fileChange(this);"/>
    </body>
    </html>

  • 相关阅读:
    线段树专辑—— pku 1436 Horizontally Visible Segments
    线段树专辑——pku 3667 Hotel
    线段树专辑——hdu 1540 Tunnel Warfare
    线段树专辑—— hdu 1828 Picture
    线段树专辑—— hdu 1542 Atlantis
    线段树专辑 —— pku 2482 Stars in Your Window
    线段树专辑 —— pku 3225 Help with Intervals
    线段树专辑—— hdu 1255 覆盖的面积
    线段树专辑—— hdu 3016 Man Down
    Ajax跨域访问
  • 原文地址:https://www.cnblogs.com/Steven5007/p/7865874.html
Copyright © 2011-2022 走看看