文本元素返回"undefined"

JavaScript: text element returning "undefined"

本文关键字:quot undefined 元素 返回 文本      更新时间:2023-09-26

我试图检索每个文本框中输入的文本,通过查询和循环通过ID标记。

但是当我打印我检索到的内容时,它输出"undefined"。

看起来你的帖子主要是代码:

</head>
  <body bgcolor="#E6E6FA">
    <font color=black size=+3>Modifying Sentiment</font>
    <table>
      <tr>
        <td>Text to Save:</td>
      </tr>
      <tr>
        <td colspan="3">
          Add positive adjective:
          <img Adjective src="http://findicons.com/files/icons/2776/android_icons/96/ic_question_mark.png" alt="question" title="Adjective: is a word naming an attribute of a noun, such as sweet, red, or technical."
            width=20 />
          <br>
          <textarea cols=40 rows=3 id="textbox" ></textarea>
          <textarea id="textbox" style="width:512px;height:256px"></textarea>
        </td>
      </tr>
      <tr>
        <td>Filename to Save As:</td>
        <td><input id="inputFileNameToSaveAs"></input></td>
        <td><button onclick="saveTextAsFile()">Save Text to File</button></td>
      </tr>
      <tr>
        <td>Select a File to Load:</td>
        <td><input type="file" id="fileToLoad"></td>
        <td><button onclick="loadFileAsText()">Load Selected File</button>
        <td>
      </tr>
    </table>
    <script type='text/javascript'>
      function saveTextAsFile(){
        var textBoxes = document.querySelectorAll('textbox');
        var textToWrite;
        for(var i in textBoxes){
          textToWrite = textBoxes[i].value;
          window.alert(textToWrite);
        }
        var textToWrite = document.getElementById("textbox").value;
        var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
        var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;
      }
    </script>

我已经编辑了你的javascript指向textarea而不是textbox。我还修改了你的for循环,因为我在控制台获得额外的输出。我还将您的alert更改为console.log,因为jsbin抛出了可能无限循环的错误。试试这个:

function saveTextAsFile()
{
    var textBoxes = document.querySelectorAll('textarea');
    var textToWrite;
    for(var i = 0; i < textBoxes.length; ++i){
      textToWrite = textBoxes[i].value;
      console.log(textToWrite);
    }

    textToWrite = document.getElementById("textarea").value;
    var textFileAsBlob = new Blob([textToWrite],{type:'text/plain'});
    var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;
}

尝试使用#textbox作为dom元素的ID

实际上,html文档中的每个id值都应该是唯一的。在你的HTML代码中,我可以看到两个id参数具有相同的值"文本框"。尝试将第一个更改为"textbox-1"或任何对你有意义的东西,但不要重复相同的id属性值,它应该工作