Блог

Главная - Вопросы по программированию - Как распечатать или получить значение ячейки из ТАБЛИЦЫ HTML (пользовательский ввод)

Как распечатать или получить значение ячейки из ТАБЛИЦЫ HTML (пользовательский ввод)

#javascript #html

#javascript #HTML

Вопрос:

У меня есть таблица, и в таблице у меня есть тег для получения пользовательского ввода. Я хочу распечатать или получить значение из ячейки таблицы. Я хочу ввести два числа, такие как 12 и 14, а затем распечатать значение суммы в идентификаторе результата. Я не хочу использовать тег формы. Возможно ли это сделать? Спасибо.

 for(i=0;i<x.length-1;i  )
  {
  result=x[i].cellIndex   x[i 1].cellIndex;
  document.getElementById("result").innerHTML=resu<
  }  
 <!DOCTYPE HTML>
<html>

<body>
<table>
  <tr>
      <td> <input id="firstnumber" type="number"> </td>
      <td> <input id="secondNumber" type="number"> </td>
  </tr>
  <p id="result"></p>
</table>
</body>
</html>

Комментарии:

1. Да, вы можете сделать это без использования тега формы

Ответ №1:

Вот рабочий пример

 // get the Dom object of the ttwo cells
var cell1 = document.querySelector("#firstnumber"),
  cell2 = document.querySelector("#secondNumber");

// when the user writes on each of them the result changes
cell1.oninput = cell2.oninput = function() {
  //   before the cell.value only for casting the string to a number
  document.getElementById("result").innerHTML =  cell1.value    cell2.value;
}  
 <!DOCTYPE HTML>
<html>

<body>
<table>
  <tr>
      <td> <input id="firstnumber" type="number"> </td>
      <td> <input id="secondNumber" type="number"> </td>
  </tr>
  <p id="result"></p>
</table>
</body>
</html>

Ответ №2:

вы можете обернуть элементы td в тег tBodies, после чего вы сможете получить доступ к каждому элементу в таблице следующим образом:

 let index_1 = document.getElementById("myTable").tBodies[0];

tBodies[0] представляет индекс таблицы. 0 является первым элементом в массиве tables tbodies.