2015-10-27 1 views
0

Я пытаюсь получить введенный текст в каждом текстовом поле, запросив и перейдя по тегу ID.JavaScript: текстовый элемент, возвращающий «undefined»

Но когда я печатаю то, что я получил, он выводит «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> 
+0

первый: 'document.querySelectorAll ('текстовое поле');' 'должно быть document.querySelectorAll ('# textbox '); ' – morels

+0

Вы не можете повторно использовать значения« id ». Они должны быть уникальными для каждого элемента. – Pointy

+0

second: поскольку @Pointy вводит каждый 'textarea', должен иметь другой идентификатор и короткий описывающий класс, чтобы вы могли конвертировать' document.querySelectorAll ('textbox'); 'to' document.querySelectorAll ('textbox.my-class'); ' – morels

ответ

1

Я отредактировал ваш 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; 
} 
+0

Я использовал приведенный выше пример вместе с ('#textbox'); исправлять проблему. –

0

Фактически каждое значение идентификатора в HTML документе должно быть уникальным. В вашем HTML-коде я вижу два параметра id с тем же значением «текстовое поле». Попытайтесь изменить первый на «textbox-1» или что-то имеющее смысл для вас, но не повторяйте одно и то же значение для свойства id, и оно должно работать.

1

Попытка с помощью #textbox, как это относится к ID из элементов DOM

+0

Это больше подходит для комментариев. – CinCout