2013-05-30 2 views
0

У меня есть таблица HTML, и я могу добавить новую строку в эту таблицу с помощью javascript. Я хочу вызвать функцию javascript (Ajax), используя событие onchange для каждой из ячеек таблицы. `Javascript/Ajax - событие обмена для динамически добавленной строки

<script type="text/javascript" src="nextTest.js"></script> 
    <SCRIPT language="javascript"> 
      function addRow(tableID) { 

      var table = document.getElementById(tableID); 

      var rowCount = table.rows.length; 
      var row = table.insertRow(rowCount); 

      var cell1 = row.insertCell(0); 
      cell1.innerHTML = rowCount + 1; 

      var cell2 = row.insertCell(1); 
      var element2 = document.createElement("input"); 
      element2.type = "text"; 
      element2.name = "txtbox[]"; 
     element2.onchange = nexttest(); 
      cell2.appendChild(element2); 

    } 

    </SCRIPT> 

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

<TABLE id="dataTable" width="350px" border="1"> 
    <TR> 
     <TD> 1 </TD> 
     <TD> <INPUT type="text" /> </TD> 
    </TR> 
</TABLE> 

</body> 
</html>` 

При нажатии на кнопку, добавляется новая строка и OnChange событие. Что я хочу сделать, когда кто-то вводит данные в эти новые ячейки, я хочу, чтобы событие onchange запускалось. Событие называется «nextTest» и хранится во внешнем файле.

Когда я вставляю новую строку, событие срабатывает, но если я обновляю одну из ячеек, ничего не происходит. Что я делаю неправильно?

Заранее спасибо

ответ

1

вы должны назначить функцию, а не вызов функции (кроме вызываемой функции возвращает другую функцию).

Опустить скобки:

element2.onchange = nexttest; 
0
function nexttest(evt){ 
     alert(evt.target.value); 
    } 

    function addRow (tableID) { 

     var table = document.getElementById(tableID); 

     var rowCount = table.rows.length; 
     var row = table.insertRow(rowCount); 

     var cell1 = row.insertCell(0); 
     cell1.innerHTML = rowCount + 1; 

     var cell2 = row.insertCell(1); 
     var element2 = document.createElement("input"); 
     element2.type = "text"; 
     element2.name = "txtbox[]"; 
     element2.onchange = nexttest; // give a valid function identifier here . 
     cell2.appendChild(element2); 

    } 

http://jsbin.com/iropam/2/edit

+0

Really ??? Смотрел на это часами, и это все? Большое спасибо, это сделало меня очень счастливым :) – user2435645

+0

Как передать параметр другому файлу с помощью этого метода? – user2435645

+0

http://jsbin.com/iropam/4/edit – Diode

Смежные вопросы