如何限制选择上传的文件名预览中的字符？

debugcn 发表于 Dev

凶猛的

我正在使用Twitter Bootstrap框架。我单击上传按钮，然后选择一个需要上传的文件。然后将上传按钮更改为更改，并在其旁边显示所选文件的名称。但是如果我们有一个大文件名，我想限制文件名字符大约要50个。如何实现？

<div class="span5">
        <div class="fileupload fileupload-new"
         data-provides="fileupload">
         <span class="btn btn-file" id="uploadRef"> <span class="fileupload-new">Upload
           Referral Script</span> <span class="fileupload-exists">Change</span>
          <form:input type="file" path="refuploadScript"
           onchange="return checkFileExists();" />
         </span> <span class="fileupload-preview"></span>


          <a href="#"
          class="close fileupload-exists" data-dismiss="fileupload"
          style="float: none">x</a>
        </div>
</div>

博涅祖维兹

为此，首先隐藏默认文件名显示范围。然后处理文件名并单独显示。

因此，要隐藏默认值：

<span class="fileupload-preview" style="display: none;"></span>

在表单输入更改时，调用以下脚本函数

function truncatefile() // calling a function on change or select
{                           
   var fup = document.getElementById('patientupload'); //store file by ID
   var file = fup.files[0]; // store value of file
   var filePath = fup.value; 
   var name;                
   if(filePath=="")                 
   {                    
      document.getElementById('fname').innerHTML = '';                  
   }                
   else                 
   {                    
      name=filePath.replace(/^.*[\\\/]/, '');

      var ext = filePath.substring(filePath.lastIndexOf('.') + 1);//getting file extension

      var fileName = name.substring(0,name.length-4); // storing 0th position till extension begining

      var fileNameNew=""; 
      if(fileName.length > 30)  
      {
         var fileNameFst=fileName.substring(0,24); //firstpart of file
         var fileNameLst=fileName.substring(fileName.length-5,fileName.length); //last part of file
         fileNameNew=fileNameFst+ "...." + fileNameLst+"."+ext; //combine all parts         
      }         
      else
      {         
         fileNameNew=fileName+"."+ext; //if length less than 30 
      }                     
      document.getElementById('fname').innerHTML = fileNameNew;                 
   }