Показать сообщение отдельно
  #7 (permalink)  
Старый 28.10.2016, 15:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

birt, смотрите весь код внимательно!
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   body {
    counter-reset: list;
   }

   #v_table tbody tr td:nth-child(1):before{
    position: absolute;
    display: block;
    margin-top: -12px;
    counter-increment: list;
    content: counter(list);
    color: #000000;
  }
  #v_table tbody tr td:nth-child(1){
    width: 20px;
  }
  #v_table span{
     margin-left: 15px;
    text-align: center;
    font-size: 28px;
    cursor: pointer;
  }

  </style>
</head>

<body>
<table id="v_table">
  <tbody>
    <tr>
      <td></td><td><input type="text" class="nep"></td>
    </tr>
  </tbody>
  <tfoot>
    <tr><td colspan="2"><center><button onclick="add_value_f()">+</button></center></td></tr>
    <tr><td colspan="2"><center><input type="text" name="sum" id="sum"></td></tr>
  </tfoot>

</table>
<script>
var d = document;

function add_value_f() {
    var tbody = d.getElementById("v_table").getElementsByTagName("tbody")[0];
    var row = d.createElement("tr");
    tbody.appendChild(row);
    var td1 = d.createElement("td");
    var td2 = d.createElement("td");
    row.appendChild(td1);
    row.appendChild(td2);
    td2.innerHTML = '<input type="text" class="nep">'
    var span = d.createElement("span");
    span.innerHTML='-';
    span.addEventListener("click", function() {tbody.removeChild(row)})
    td2.appendChild(span)
}
var table = d.getElementById("v_table"),
    sum = d.getElementById("sum");
table.addEventListener("input", function() {
    sum.value = [].reduce.call(table.querySelectorAll('.nep'), function(summ, item) {
        return summ += +item.value || 0
    }, 0)
});
</script>

</body>
</html>
Ответить с цитированием