Question

我说道歉要问这个重复的问题。

我已经尝试了很多文件Uploading的例子，最后我编写了下面的代码。

点击超链接后，它会询问文件，然后选择文件。

但是我想在表格中显示文件名，我无法在桌面上显示。

  <div class="sf_coursehead">
    Upload FileList <a href="#" class="addnew">+ Add New</a> 
           <input type="file" id="upload_input" name="courseAgenda" style="font-size: 50px;
 width: 120px; opacity: 0; filter: alpha(opacity :0); position: relative; top: -40px;; left: -20px" />
  </div>
<table>
  <tr>
    <td><td>
  </tr>
</table>

但是如何在表格中显示所选文件，这意味着每个选择表都将添加new row

所以请帮我在表格中显示文件名，

给我一个建议。编辑：这也行不通..

$("#upload_input").change(function(){
    var filename = document.getElementById('id_transactions').val();
    alert(filename);
});

Answer 1

此代码可能是您需要的，

<script>

$（document）.ready（function（）{

$（“＃upload_input”）。change（function（）{
var file_name=$("#upload_input").val(); 
$("#list_files").append("`<tr><td>`"+file_name+"`</td></tr>`');
}); });

</script>

</head> <body>

<table id="list_files"> </table>

Answer 2

这是我的工作代码..

    <img src="resources/images/profile_image.png" alt="Profile Image"
    width="120" height="150" class="prif_img" />
    <a href="#" class="addnew">NewImage</a> 
<input type="file" id="upload_input" name="courseAgenda"
style="font-size: 50px; width: 120px; opacity: 0; filter: alpha(opacity : 0); position: relative; top: -40px;; left: -20px" onchange="uploadFile_onChange(this);" />

脚本：

function uploadFile_onChange(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function(e) {
            $('.prif_img').attr('src', e.target.result).width(120).height(150);


        };

        reader.readAsDataURL(input.files[0]);
    }
}

文件上传并使用Javascript在表中显示文件名？

2 个答案: