0

我在表上有一个删除按钮，在单击事件监听器上有一个 jquery 按钮。这是代码

$(".delbtn").click(function () { 
    var count = 0;
    var $row = jQuery(this).closest('tr'); 
    var $columns = $row.find('td'); 

    var values = ""; 

    jQuery.each($columns, function(i, item) { 
        if( count == 0 ){delFund = item.innerHTML}
        if( count == 1) {delOrg  = item.innerHTML}
        if( count == 2) {stat = item.innerHTML }    
        count++
    }); 

//the below lines of codes would display how to show values on a browser like 
// firefox or chrome.
//console.log(delFund, delOrg);


    $(this).closest("tr").fadeTo(500, 0, function () {  
        $(this).remove(); 
    }); 


//update the item on the database table for deletion.
  $.ajax({type: "POST",
          url: "dbfunctions.jsp",  
          data: {TYPE:'D', fundval: delFund, orgval: delOrg, tuidval:tuid, status:stat }}).done(function( msg )
          {  
            //alert(msg);
          });

});

这一切都很好，我的问题是我查询了一个数据库，然后我用这个数据更新了 html 表，并在表的最后一行添加了一个新按钮。但是，当我单击它时，该按钮没有响应。我相信是因为没有附加事件侦听器。所以我的问题是如何更新按钮，以便我已经添加到所有先前按钮的事件侦听器也附加到新的动态生成按钮？

这是我如何将项目添加到表格末尾的代码片段。

$("#thisTable > tbody").append( 
                                        "<tr><td>"+thisfund.value+"</td>"+
                                        "<td>"+thisorg.value+"</td>"+
                                        "<td>"+'PENDING ACCESS'+"</td>" +
                                        "<td>"+"<a class='delbtn' href='#'>X</a>"+"</td></tr>");
        thisfund.value = "";// set the input boxes back to null
            thisorg.value  = "";

          });
4

3 回答 3

3

.delbtn 上的单击事件不是实时事件，不会应用于新附加的元素。

根据您使用的 JQuery 版本，您可以使用以下方法之一来添加实时事件。

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+
于 2012-06-27T02:06:49.577 回答
2

试试这个人：

接口：http ://api.jquery.com/on/

.on() 方法将事件处理程序附加到 jQuery 对象中当前选定的元素集。

任何事件名称都可用于 events 参数。jQuery 会通过浏览器的标准 JavaScript 事件类型，在浏览器由于点击等用户动作产生事件时调用处理函数。

在您的情况下，即使带有事件的新 trclass='delbtn'将.on接管它。

希望这可以帮助，

代码

$(document).on('click','.delbtn',function () { 
    var count = 0;
    var $row = jQuery(this).closest('tr'); 
    var $columns = $row.find('td'); 

    var values = ""; 

    jQuery.each($columns, function(i, item) { 
        if( count == 0 ){delFund = item.innerHTML}
        if( count == 1) {delOrg  = item.innerHTML}
        if( count == 2) {stat = item.innerHTML }    
        count++
    });
于 2012-06-27T02:02:31.553 回答
0

试试这个

$(newButton).bind('click',function(){...})
于 2012-06-27T02:03:29.457 回答