Question

我有一个上传文件的表单。上传文件后，我已经创建了一个函数来显示上传文件中的文本。

但是，当文本显示时，它会显示在一行中。如何让它以多行显示？

＆＃13;

function loadFileAsText() {
  var fileToLoad = document.getElementById("fileToLoad").files[0];

  var fileReader = new FileReader();
  fileReader.onload = function(fileLoadedEvent) {
    var textFromFileLoaded = fileLoadedEvent.target.result;
    document.getElementById("inputTextToSave").value = textFromFileLoaded;
  };

  fileReader.readAsText(fileToLoad, "UTF-8");
}

＆＃13;

#inputTextToSave {
  height: 500px;
  width: 500px;
  text-align: left;
  font-size: 8pt;
  white-space: nowrap;
  line-height: 10pt;
}

＆＃13;

<html>

<head>
</head>

<body>

  <tr>
    <td>Select a File to Load:</td>
    <td><input type="file" id="fileToLoad"></td>
    <td><br><br><button onclick="loadFileAsText()">Load Selected File</button>
      <td>
        <td>
          <div><input type="text" id="inputTextToSave"> </div>
  </tr>
</body>

</html>

＆＃13;

Answer 1

input元素只能用于单行数据。也许你想使用textarea元素：

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

文本显示在一行中

1 个答案: