用JS引导文件输入（在PHP中）

我想创建一个页面来发送问题。因此，人们可能希望上传包含该问题的图片。整个页面使用引导程序。我曾在Google上看过，最喜欢https://codepen.io/claviska/pen/vAgmd。最后的解决方案似乎很好。但我没有在文本框中获取文件名。我在做什么错？我用在笔所示的代码：用JS引导文件输入（在PHP中）

<div class="form-group"> 
<label for="files">Select some screenshots to append</label> 
<div class="input-group"> 
<span class="input-group-btn"> 
<span class="btn btn-primary btn-file"> 
Browse&hellip; 
<input type="file" name="files" single> 
</span> 
</span> 
<input type="text" class="form-control" readonly> 
</div>

JS：

$(function() { 

    // We can attach the `fileselect` event to all file inputs on the page 
    $(document).on('change', ':file', function() { 
     var input = $(this), 
      numFiles = input.get(0).files ? input.get(0).files.length : 1, 
      label = input.val().replace(/\\/g, '/').replace(/.*\//, ''); 
     input.trigger('fileselect', [numFiles, label]); 
    }); 

    // We can watch for our custom `fileselect` event like this 
    $(document).ready(function() { 
     $(':file').on('fileselect', function(event, numFiles, label) { 

      var input = $(this).parents('.input-group').find(':text'), 
       log = numFiles > 1 ? numFiles + ' files selected' : label; 

      if (input.length) { 
       input.val(log); 
      } else { 
       if (log) alert(log); 
      } 

     }); 
    }); 

});

我的全页：http://gelbpunkt.troet.org/browsercheck/issue.php 引导被包括，以及jQuery的。

来源

2017-10-07 Jens Reidel

设置在警报是输入字段的值，而是首先给输入字段的ID喜欢文件名：

<input type="text" id="fileName" class="form-control" readonly>

然后在你的jQuery，删除警报，并设置文件名有：

if(log){ 
    //alert(log); 
    $("#fileName").val(log); 
}

见sample

来源

2017-10-09 09:43:32 Laiman

是啊，这工作。现在我正在使用bootstrap-fileinput，它可以工作得更好。谢谢你的回答，我接受了。 –

@JensReidel谢谢。没关系。 – Laiman

用JS引导文件输入（在PHP中）

回答

相关问题