Question

这是我的代码：

<h1>JavaScript File API demo</h1>
<div id="container">
<label>Upload files to local repository:</label><input type="file" accept=".js" id="uploaded" multiple="multiple"/>
<div id="fileInfo" ></div>

<textarea rows="4" cols="50" id="fileInfo2"></textarea> 

</div>

<p></p>

<script>
$(document).ready(function() {

  if(!(window.File && window.FileReader && window.FileList && window.Blob)){
    $('#fileContent, input, button, #examples').fadeOut("fast");
    $('<p>Oh no, you need a browser that supports File API. How about <a href="http://www.google.com/chrome">Google/a>?</p>').appendTo('#container');
  } else {
          $("#uploaded").change(function (e) {
                var files = e.target.files; // FileList object
                // files is a FileList of File objects. List some properties.
                var output = [];
                for (var i = 0, f; f = files[i]; i++) {
                  output.push('<li><strong>', escape(f.name), 
                            '</strong> (', f.type || 'n/a', ') - ',
                            f.size, ' bytes, last modified: ',
                            f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                            '</li>');
                  var reader = new FileReader();
                  reader.onload = function(e) {
                      $("#fileInfo").append("<li> Data from file: "+"<br/>" + e.target.result.replace(/\n/g, "<br>\&nbsp") + "</li>");
                  };
                  reader.readAsText(f);
                }
                $("#fileInfo").append('<ul>' + output.join('') + n/a +'</ul>' );
          });
  }
});
</script>

此代码显示div标签中一个或多个所选文件的数据，其中id =＆＃34; fileInfo＆＃34;，在最后一行代码中使用...和第三行从下面

有没有办法让我的代码与textarea一起工作，id =＆＃34; fileInfo2＆＃34; ？我也改变了最后一行：

$("#fileInfo2").append("<li> Data from file: "+"<br/>" + e.target.result.replace(/\n/g, "<br>") + "</li>");
$("#fileInfo2").append('<ul>' + output.join('') + n/a +'</ul>' );

但是id没有用......

你帮我吗？

Answer 1

放置html insite textarea的一种方法是存储现有的textarea值并设置一个新的而不是使用append。所以替换：

$("#fileInfo2").append("<li> Data from file: "+"<br/>" + e.target.result.replace(/\n/g, "<br>") + "</li>");

带

var existingValue = $("#fileInfo2").val();
$("#fileInfo2").val(existingValue+"<li> Data from file: "+"<br/>" + e.target.result.replace(/\n/g, "<br>\&nbsp") + "</li>");

和

$("#fileInfo2").append('<ul>' + output.join('') + n/a +'</ul>' );

与

var existingValue = $("#fileInfo2").val();
$("#fileInfo2").val(existingValue+'<ul>' + output.join('') + n/a +'</ul>' );

如何将我的代码从div标签更改为textarea？

1 个答案: