为什么我不能绑定这个onclick事件?

时间:2013-07-02 05:57:03

标签: javascript jquery events web-applications onclick

我正在生成用于编辑的按钮,并使用Firebase动态删除javascript数据库中的每个元素。当数据库中只有一个元素(这些元素代表民意调查/选举)时,下面的代码工作正常。但是当有多个数据库元素,因此有多行按钮时,只添加了最后一对编辑/删除按钮实际上与click事件绑定,我想这意味着所有先前的绑定都以某种方式被覆盖?我还应该提到pollsRef.once()pollsSnapshot.forEach()都是异步函数调用(所有Firebase API调用都是如此)。这是创建和绑定按钮的功能。 ...

function displayCurrentPollsForEditing(pollsRef)
{
    var tbl = createTable();
    var th = ('<th>Polls</th>');
    $(th).attr('colspan', '3');
    $(th).appendTo($(tbl).children('thead'));
    pollsRef.once('value', function(pollsSnapshot) {
        pollsSnapshot.forEach(function(pollsChild) {
            var type = pollsChild.name();
            // If this is true if means we have a poll node
            if ($.trim(type) !== "NumPolls") 
            {
                // Create variables
                var pollRef = pollsRef.child(type);
                var pollName = pollsChild.val().Name;
                var btnEditPoll = $('<button>EDIT</button>');
                var btnRemovePoll = $('<button>REMOVE</button>');
                var tr = $('<tr></tr>');
                var voterColumn = $('<td></td>');
                var editColumn = $('<td></td>');
                var rmvColumn = $('<td></td>');
                // Append text and set attributes and listeners
                $(voterColumn).text(pollName);
                $(voterColumn).attr('width', '300px');
                $(btnEditPoll).attr({
                    'class': 'formee-table-button',
                    'font-size': '1.0em'
                });
                $(btnRemovePoll).attr({
                    'class': 'formee-table-remove-button',
                    'font-size': '1.0em'
                });
                $(btnEditPoll).appendTo($(editColumn));
                $(btnRemovePoll).appendTo($(rmvColumn));
                // Append to row and row to table body
                $(tr).append(voterColumn).append(editColumn).append(rmvColumn);
                $(tr).appendTo($(tbl).children('tbody'));
                // Append table to div to be displayed
                $('div#divEditPoll fieldset#selectPoll div#appendPolls').empty();
                $(tbl).appendTo('div#divEditPoll fieldset#selectPoll div#appendPolls');
                $(btnEditPoll).click(function() {
                    displayPollEditOptions(pollRef);
                    return false;
                });
                $(btnRemovePoll).click(function() {
                    deletePoll($(this), pollsRef);
                    return false;
                });
            }
        });
    });
}

按钮只是在以编程方式生成的表中呈现,所有jQuery选择器都是正确的。

0 个答案:

没有答案