Доступ к текстовому полю внутри HTML-таблицы в JavaScript - PullRequest
Новая
       7

Доступ к текстовому полю внутри HTML-таблицы в JavaScript

0 голосов
/ 01 июня 2018

Я хочу получить доступ к тексту, помещенному в строках динамической таблицы в javascript.

Структура моей таблицы: - 

<BODY>

<INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />

<INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />

<TABLE id="dataTable" width="650px" border="2">
    <TR >
        <TD><INPUT type="checkbox" name="chk[]" /></TD>
        <TD ><INPUT type="text" name="txt[]" /></TD>
        <TD>
            <INPUT type="text" name="time[]" />                         
        </TD>

    </TR>
</TABLE>
</BR>
</BR>
<INPUT type = "button" value = "Submit" onclick = "myFunction()"></BODY>

- Спасибо

Ответы [ 3 ]

0 голосов
/ 01 июня 2018

если вы хотите получить все входные значения в таблице, вы можете сделать это. 

var a = document.getElementById("dataTable").getElementsByTagName("input");

, поэтому var a стал массивом, а внутри него находятся элементы, которые вы хотели получить простоиспользовать цикл. 

var e = a.length; // get how many input inside the table
for(x=0;x<e;x++){
    console.log(a[x].name+" the value inside is  "+a[x].value);
}
0 голосов
/ 01 июня 2018

Просто возьмите рассматриваемые элементы с помощью .getElementsByName(), а затем верните их .value.Вы можете увидеть, установлен ли флажок или нет, с помощью .checked.

Обратите внимание, что .getElementsByName() возвращает коллекцию NodeList объектов, поэтому вы захотитеполучить первый результат с помощью [0].

Это можно увидеть в следующем: 

function myFunction() {
  let chk = document.getElementsByName('chk[]')[0].checked;
  let txt = document.getElementsByName('txt[]')[0].value;
  let time = document.getElementsByName('time[]')[0].value;
  
  console.log("Checkbox checked?:", chk);
  console.log("Text:", txt);
  console.log("Time:", time);
}
<BODY>
  <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
  <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
  <TABLE id="dataTable" width="650px" border="2">
    <TR>
      <TD>
        <INPUT type="checkbox" name="chk[]" />
      </TD>
      <TD>
        <INPUT type="text" name="txt[]" />
      </TD>
      <TD>
        <INPUT type="text" name="time[]" />
      </TD>
    </TR>
  </TABLE>
  <BR />
  <BR />
  <INPUT type="button" value="Submit" onclick="myFunction()" />
</BODY>

Обратите внимание, что в вашем окончательном <input> отсутствует закрывающий /, а ваши </br> теги должны быть <br />.Они были исправлены в приведенном выше примере.

0 голосов
/ 01 июня 2018

У вас есть идентификатор для указанной строки?Если у вас нет идентификатора места в строке, откуда вы хотите изменить текст и «поймать» его с помощью JavaScript.Функция называется var a = document.getElementById ('ID_OF_SAMPLE_ROW'). Значение и текст хранятся в переменной a.Эта функция должна вызываться по щелчку или что-то подобное, поэтому вы должны указать, когда вы читаете и из какой строки.

...