Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Достать значение из td (https://javascript.ru/forum/misc/63830-dostat-znachenie-iz-td.html)

nikolayblinov 02.07.2016 00:51

Достать значение из td
 
У меня такая задача: перемножить значение в инпуте на значение во второй ячейки каждого ряда, и выводить результат в третьей ячейки.

Не могу достать значение из второй ячейки

Как это проще сделать ?

<form id="myForm"><input type="number" id="myNumber" value="5"><input type="submit" value="Do"></form>
<table class="my-table">
<thead>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
        <th>Header 2</th>
    </tr>
</thead>
<tbody>
    <tr data-row-num="1">
        <td>Item 1</td>
        <td>10</td>
        <td>10</td>
    </tr>
    <tr data-row-num="1">
        <td>Item 2</td>
        <td>100</td>
        <td>10</td>
    </tr>
    <tr data-row-num="1">
        <td>Item 3</td>
        <td>1000</td>
        <td>10</td>
    </tr>
</tbody>
</table>


<script type="text/javascript">
$('#myForm').submit(function(e){
    e.preventDefault();
      var input = parseInt($(this).find('#myNumber').val()); 
    $('.my-table tr td:last-child').each(function(k, item){
    var second =  parseInt($(this).find('.my-table tr td:nth(2)-child').val());
    var current = parseInt($(item).text());
    $(item).text(second * input);
  });
  return false;
});
</script>


Оно же тут https://jsfiddle.net/mds0bxyo/

рони 02.07.2016 00:58

nikolayblinov,
нет value у ячейки!!!

рони 02.07.2016 01:04

Цитата:

Сообщение от nikolayblinov
td:nth(2)-child

:-?

рони 02.07.2016 01:06

nikolayblinov,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

  <script>
 $(function(){
 $('#myForm').submit(function(e){
    e.preventDefault();
    var input = parseInt($('#myNumber').val());
    $('.my-table tbody tr').each(function(k, item){
    var second =  parseInt($(this).find('td:nth-child(2)').text());
    $(this).find('td:nth-child(3)').text(second * input);
  });
  });
   })
  </script>
</head>

<body>
<form id="myForm"><input type="number" id="myNumber" value="5"><input type="submit" value="Do"></form>
<table class="my-table">
<thead>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
        <th>Header 2</th>
    </tr>
</thead>
<tbody>
    <tr data-row-num="1">
        <td>Item 1</td>
        <td>10</td>
        <td>10</td>
    </tr>
    <tr data-row-num="1">
        <td>Item 2</td>
        <td>100</td>
        <td>10</td>
    </tr>
    <tr data-row-num="1">
        <td>Item 3</td>
        <td>1000</td>
        <td>10</td>
    </tr>
</tbody>
</table>
</body>
</html>

Rasy 02.07.2016 09:40

рони,
Как вы могли оставить return false в коде, ведь уже есть отмена события по умолчанию) Или я чего-то недопонимаю?

рони 02.07.2016 10:08

Цитата:

Сообщение от Rasy
Как вы могли

был потрясён предоставленным кодом :lol: особенно поиском ячеек в ячейке


Часовой пояс GMT +3, время: 13:09.