jquery - 使用类型文件上传的名称更新 div

Question

我正在尝试将 div 的值更改为上传的文件的名称。在我的jsfiddle您可以看到浏览工作正常，但 div 没有更新。有人可以解释一下如何做到这一点吗？

    <form action="#">
    <input type="file" name="up_image_0" id="fileupload_0" onChange="ShowImageName('0')">
    <input type="file" name="up_image_1" id="fileupload_1" onChange="ShowImageName('1')">

    <input type="text" name="color_image_0" value="" id="img-holder_0">
    <input type="text" name="color_image_1" value="" id="img-holder_1">
    </form>

    <script>
     function ShowImageName(idx) {
      var new_name = $("#fileupload_"+idx).val();
      $("#img-holder_"+idx).text(new_name);
     } 
    </script>

Answer 1

这里有一个解决方案 https://jsfiddle.net/u5w17dug/2/

ShowImageName = function(idx) {
  $("#img-holder_"+idx).val($("#fileupload_"+idx).val());
} 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="#">
  <input type="file" name="up_image_0" id="fileupload_0" onChange="ShowImageName('0')">
  <input type="file" name="up_image_1" id="fileupload_1" onChange="ShowImageName('1')">

  <input type="text" name="color_image_0" value="" id="img-holder_0">
  <input type="text" name="color_image_1" value="" id="img-holder_1">
</form>

将代码 $("#img-holder_"+idx).text(new_name); 更改为 $("#img-holder_"+idx).val(new_name) ;

要使用 jQuery 为 input 赋值，请使用 .val() 方法，而不是 .text() .