insertAfter（）通過加倍追加

我試圖在一些證書tr後附加tr，我使用此代碼。但它是通過加倍追加，第一次只有1，第二次2和第三次6 ......有人可以幫我解決這個問題嗎？我只想每次點擊只添加一個tr。insertAfter（）通過加倍追加

function einfugen(){ 
    $('#append_tr').bind('click', function(){ 
    $('<tr><td>new td</td></tr>').insertAfter('#append_tr'); 
    }); 
} 



<tr id="append_tr"> some data </td>

編輯：這裏是我的綁定代碼：

<tr id="append_tr"><td> <a onclick="einfugen()"> + add </a> </td></tr>

感謝您的幫助

來源

2013-02-08 doniyor

你einfugen()函數聲明單擊處理程序，並將其從單擊事件在這裏呼籲：

<tr id="append_tr"><td> <a onclick="einfugen()"> + add </a> </td></tr>

你越點擊它，附加更多的點擊處理程序。你可以做的反而是去除einfugen()函數聲明，但內容移動到DOM準備函數：

$(function() { 
    $('#append_tr').on('click', function(){ 
    $('<tr><td>new td</td></tr>').insertAfter('#append_tr'); 
    }); 
});

具有單擊處理那裏註冊省去了內聯onclick處理程序代碼。

來源

2013-02-08 13:35:05

不完全是，您的「第一個」只在「onclick」調用的函數內。如果後者被刪除，* no *處理程序將被添加。 – 2013-02-08 13:37:37

@DavidHedlund，是的，你是對的，它現在不工作 – doniyor 2013-02-08 13:38:27

@傑克，謝謝，你點了。我將函數調用改爲''（function（）{}）''現在像一個魅力：D – doniyor 2013-02-08 13:41:07

這聽起來像你打電話超過一次einfugen更多。如果您只調用一次，它將起作用（Demo）。

編輯：從你的更新，是的，你每次點擊「添加」鏈接時都綁定一個監聽器。你很困惑發起了一個動作，這將在onclick合理，綁定聽衆在給定事件發射。

當einfugen運行時，您的insertAfter未運行。 einfugen只是添加一個偵聽器，指示該代碼在發生點擊時運行。所以這個調用可以一次完成，最初，然後你的聽衆將永遠在那裏。它不應該在每次點擊時添加。

你可以監聽綁定最初像這樣：

$(function() { 
    $('#append_tr').bind('click', function(){ 
    $('<tr><td>new td</td></tr>').insertAfter('#append_tr'); 
    }); 
});

哪裏$(function() { ... });是在DOMReady運行功能的簡寫，即只要所有的DOM節點都保證是由腳本訪問。

Demo。

來源

2013-02-08 13:30:18

同意。你可以發佈你的點擊綁定代碼嗎？ – Miquel 2013-02-08 13:31:10

是的，我會更新並添加綁定部分 – doniyor 2013-02-08 13:31:34

我更新了我的問題，但我似乎不止一次調用該函數，對嗎？ – doniyor 2013-02-08 13:35:13

您可能會多次調用該函數。

不要使用bind和使用on（jQuery的1.7）：

$('#append_tr').on('click', function(){ 
    $('<tr><td>new td</td></tr>').insertAfter('#append_tr'); 
});

http://api.jquery.com/bind/

從您的編輯：

<a onclick="einfugen()">

就是問題所在。每次鏈接被點擊時，您正在重新綁定事件處理程序。

使用下面的結構，你可以這樣做：

$("#append_tr").click(function() { 
    $("#table").append("<tr><td>New row!</td></tr>"); 
});

http://jsfiddle.net/mBNbZ/

來源

2013-02-08 13:31:22

同意，'on'是綁定的首選方法，但這並不能解決這個問題。 – 2013-02-08 13:32:44

@DavidHedlund - 我同意它可能無法解決問題，因爲我相信OP正在多次調用einfugen函數。然而，在推薦最佳實踐方面沒有壞處。 – 2013-02-08 13:34:10

我不是多次調用函數，請參閱我的更新。 – doniyor 2013-02-08 13:34:49

insertAfter（）通過加倍追加

回答

相關問題