jQuery按钮不执行onclick

问题描述：

我有一个jQuery的函数，循环通过一个XML并将其显示在一个表中，并有每行的按钮，因此用户可以点击它并删除该记录。就像我附加的代码一样;jQuery按钮不执行onclick

$('#btnGetRecords').click(function() { 
    $('#imgStatus').show(); 
    $.ajax({ 
     type: 'POST', 
     url: '/WebService1.asmx/GetRecords', 
     data: '', 
     contentType: 'application/x-www-form-urlencoded; charset=utf-8', 
     dataType: 'xml', 
     success: function(xml) { 
      parseXml(xml); 
      $('#imgStatus').hide(); 
     }, 
     error: function(msg) { 
      $('#imgStatus').hide(); 
      alert('Error!'); 
     } 
    }); 
}); 

function DeleteRecord(receiptNo) { 
    alert(receiptNo); 
    $('#divOutput').html(''); 
    $('#imgStatus').show(); 
    $.ajax({ 
     type: 'POST', 
     url: '/WebService1.asmx/DeleteRecord', 
     data: 'receiptNo=' + receiptNo, 
     contentType: 'application/x-www-form-urlencoded; charset=utf-8', 
     dataType: 'xml', 
     success: function(msg) { 
      $('#delete_dialog').dialog('open'); 
      $('#imgStatus').hide(); 
     }, 
     error: function(msg) { 
      $('#imgStatus').hide(); 
      alert('Error!'); 
     } 
    }); 
} 

function parseXml(xml) { 
    $('#divOutput').html(''); 
    var x = 1; 
    var _html = '<br />'; 
    _html += '<table id="tblRecords" >'; 
    $(xml).find('Table').each(function() { 
     var fname = $(this).find('FName').text(); 
     var lname = $(this).find('LName').text(); 
     var receiptNo = $(this).find('ReceiptNo').text(); 
     _html += '<tr>'; 
     _html += '<td>'; 
     _html += fname + ' ' + lname; 
     _html += '</td>'; 
     _html += '<td>'; 
     _html += $('<input type="button" class="clsBtnDelete" id="btnDeleteRecord' + x + '" value="Delete" onclick="DeleteRecord(' + receiptNo + ');" />'; 
     _html += '</td>'; 
     _html += '</tr>'; 
     // alert(_html); 
     x++; 
    }); 
    _html += '</table>'; 
    $('#divOutput').append(_html); 
}

但由于某种原因，删除按钮不会调用函数来执行删除。任何想法如何使这个工作。谢谢！

-Ryan

你有删除按钮的点击方法？似乎从您的帖子中失踪。 – CmdrTallen 2009-10-23 01:44:01

答

添加您onclick事件添加表到DOM后。喜欢的东西：

$('#tblRecords .clsBtnDelete').click(DeleteRecord);

而且具有DeleteRecord（）函数，得到ReceiptNo例如，<按钮>的ID：

使用
已经DeleteRecord()分裂的id值在_，并使用第二（数字）部分

谢谢乔尔，但它似乎仍然不会工作。我应该删除它说onclick =“DeleteRecord（'+ receiptNo +'）;”的部分“并在你给我的代码缺少一个参数，我怎么添加使用你的代码？谢谢！ – Ryan 2009-10-23 01:53:35

将尝试。谢谢！ – Ryan 2009-10-23 01:58:57

答

在表面上看起来很好，但因为它看起来像你正在使用ASP.NET我猜测，btnGetRecords是一个asp：Button。

看看你从服务器得到的HTML，并确保按钮有你认为它的ID。在ASP.NET你通常在jQuery选择看到这个

$('#<%= btnSomething.ClientID %>')

另外，在IE表中的行/细胞有时只读。

嗨wm_eddie！我使用。 – Ryan 2009-10-23 01:57:25

在这种情况下，我不确定问题是什么，因为就像我说的，JavaScript代码看起来很好。你有没有尝试过使用萤火虫？另外，您确定您的JavaScript代码没有语法错误，这些代码通常会阻止剩下的代码运行。 – 2009-10-23 04:38:22

答

Got it！

function parseXml(xml) { 
    $('#divOutput').html(''); 
    var _html = '<br />'; 
    _html += '<table id="tblRecords" >'; 
    $(xml).find('Table').each(function() { 
     var fname = $(this).find('FName').text(); 
     var lname = $(this).find('LName').text(); 
     var receiptNo = $(this).find('ReceiptNo').text(); 
     _html += '<tr>'; 
     _html += '<td>'; 
     _html += fname + ' ' + lname; 
     _html += '</td>'; 
     _html += '<td>'; 
     _html += '<input type="button" class="clsBtnDelete" id="btnDeleteRecord_' + receiptNo + '" value="Delete" />'; 
     _html += '</td>'; 
     _html += '</tr>'; 
    }); 
    _html += '</table>'; 
    $(_html).appendTo('#divOutput'); 

    $('#tblRecords .clsBtnDelete').click(function() { 
     alert('y'); 
     var cId = $(this).attr('id'); 
     var arr = cId.split('_'); 
     var receiptNo = arr[1]; 
     DeleteRecord(receiptNo); 
    }); 
}

我把代码块放在解析XML中。谢谢乔尔！

jQuery按钮不执行onclick

相关推荐