Javascriptが私はJavaScriptで新しいテーブルの行を追加していたテキストとのonClick

Question

でHTMLテーブルに行を追加します。上記のコードで

var i=1; 
function addRow(seq, nominalcode, description, quantity, unitprice) { 
    seq = seq || ''; 
    nominalcode = nominalcode || ''; 
    description = description || ''; 
    quantity = quantity || ''; 
    unitprice = unitprice || ''; 

    var tbl = document.getElementById('table1'); 
    var lastRow = tbl.rows.length - 4; 
    //var iteration = lastRow - 1; 
    var row = tbl.insertRow(lastRow); 

    row.id = 'item_row_' + i; 

    var Cell0 = row.insertCell(0); 
    var elItemSequence = document.createElement('input'); 
    elItemSequence.type = 'hidden'; 
    elItemSequence.name = 'item_sequence' + i; 
    elItemSequence.id = 'item_sequence' + i; 
    elItemSequence.value = seq; 
    Cell0.appendChild(elItemSequence); 

    var elNominalcode = document.createElement('input'); 
    elNominalcode.type = 'textarea'; 
    elNominalcode.className = 'form-control'; 
    elNominalcode.name = 'nominal_code' + i; 
    elNominalcode.id = 'nominal_code' + i; 
    elNominalcode.placeholder = 'Nominal Code'; 
    elNominalcode.value = nominalcode; 
    Cell0.appendChild(elNominalcode); 

    var Cell1 = row.insertCell(1); 
    var elDescription = document.createElement('textarea'); 
    elDescription.type = 'textarea'; 
    elDescription.className = 'form-control'; 
    elDescription.name = 'description' + i; 
    elDescription.id = 'description' + i; 
    elDescription.placeholder = 'Description'; 
    elDescription.value = description; 
    elDescription.cols = 40; 
    elDescription.rows = 2; 
    Cell1.appendChild(elDescription); 

    var Cell2 = row.insertCell(2); 
    var elQuantity = document.createElement('input'); 
    elQuantity.type = 'text'; 
    elQuantity.className = 'form-control'; 
    elQuantity.name = 'quantity' + i; 
    elQuantity.id = 'quantity' + i; 
    elQuantity.placeholder = 'Quantity'; 
    elQuantity.value = quantity; 
    elQuantity.value = quantity; 
    Cell2 .appendChild(elQuantity); 

    var Cell3 = row.insertCell(3); 
    var elUnitPrice = document.createElement('input'); 
    elUnitPrice.type = 'text'; 
    elUnitPrice.className = 'form-control'; 
    elUnitPrice.name = 'unitprice' + i; 
    elUnitPrice.id = 'unitprice' + i; 
    elUnitPrice.placeholder = 'Price'; 
    elUnitPrice.value = unitprice; 
    Cell3.appendChild(elUnitPrice); 

    var Cell4 = row.insertCell(4); 
    var elDelete = document.createElement('a'); 
    elDelete.href = '#'; 
    elDelete.onclick = function(){ DeleteInvoiceLine(seq, i) }; 
    elDelete.text = 'Delete' + i; 
    Cell4.appendChild(elDelete); 

    i++; 
    document.getElementById('numrows').value = (i-1); 
    //alert(i); 
} 

毎回機能

を呼び出しますが、onClickアクションがあるが

：行は、その機能を実行して追加され、どのように私はそれだけで私の関数である aアンカー

のクリック時に関数を呼び出すことができます

Answer 1

あなたはあなたのコード内のいくつかの問題があります

elDelete.onclick = function(){ DeleteInvoiceLine(seq) };

Answer 2

無名関数を試すことができます。
onClick
2. DeleteInvoiceLine(seq)は、要素が作成された瞬間に実行されます。
の結果であるが割り当てられているため、の機能はからonclickになりません。
3.（まだ尋ねられていません）secとは何ですか？私はfor(var sec=0;sec<N;sec++)のようなものと思われ、あなたのコードはループ内にあります。これは機能しません（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures参照）。
secがクリックの瞬間に範囲外になっているため、elDelete.onclick = function(){ DeleteInvoiceLine(seq) };が機能しません。
いくつかの修正。

var i = 0; 
//... 
for(var sec=0;sec<N;sec++){ 
//your code 
elDelete.onclick = DeleteInvoiceLine(seq, i);//I keep it with purpose 
//your code 
} 
//... 
i++; 
//The key moment 
function DeleteInvoiceLine(seq, row_num){ 
    //sec comes here from the loop 
    return function(){//note(); (sec) would kill all construction 
        //and in this context would be **event {type:'click'} 
     $.ajax(
     //your code which uses **sec** and/or **row_num** 
     //this time sec and row_num are available from parent scope 
    );//$.ajax 
    }//return function 
}//function DeleteInvoiceLine 

Answer 3

これを試してみてください：動作するようです

... 
elDelete.setAttribute("onclick", "DeleteInvoiceLine("+ seq +","+ i +")"); 
....