嗯,我的主要问题是按钮。当我已经点击某个 tr 时,我似乎找不到按钮不显示的原因
这是显示从数据库返回的员工数据的代码
$.each(data, function(index, val) {
$("#employee_list").append('<tr class="emp_delete" id="'+val.emp_id+'"><td>'+val.emp_id+'</td><td>'+val.last_name+'</td><td>'+val.first_name+
'</td><td>'+val.middle_in+'</td>'+
'<td><input type="button" value="Resigned Employee" class="deleteBtn" id="delete_"'+val.emp_id+'"></td></tr>');
});
这里是在单击 .emp_delete 时显示按钮的代码。然后.deleteBtn代码删除某些数据
$(".emp_delete").click(function(){
var ID=$(this).attr('id');
$("#delete_"+ID).show();
});
$(".deleteBtn").click(function(){
var ID=$(".emp_delete").attr('id');
if (confirm("Are you sure you want to delete?")) {
var dataString = 'emp_id='+ID;
$.ajax({
type: "POST",
url: "<?php echo site_url('c_employee/delete_employee'); ?>",
data: dataString,
cache: false,
success: function(html){
location.reload();
}
});
}
更新
@Satpal 给出的代码有效,但 .deleteBtn 在经历了每个循环后仍然没有出现。
这是更新后的代码:
$('#employee_list').delegate( ".emp_delete", 'click', function() {
var ID=$(this).attr('id');
$("#delete_"+ID).show();
});
$(".deleteBtn").click(function(){
var ID=$(".emp_delete").attr('id');
if (confirm("Are you sure you want to delete?")) {
var dataString = 'emp_id='+ID;
$.ajax({
type: "POST",
url: "<?php echo site_url('c_employee/delete_employee'); ?>",
data: dataString,
cache: false,
success: function(html){
location.reload();
}
});
}
else
return false;
});
最佳答案
当您动态添加 HTML 时。
您需要使用 Event Delegation .你必须使用 .on()使用委托(delegate)事件方法。
使用
$(document).on(event, selector, eventHandler);
在上面的示例中,document
应该替换为最近的静态容器。
在你的情况下
$('#employee_list').on('click', ".emp_delete", function() {
var ID=$(this).attr('id');
$("#delete_"+ID).show();
});
同样,您必须为 ".deleteBtn"
委托(delegate)事件
Delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time.
编辑
根据评论。
由于您使用的是 jQuery 1.5,因此请使用 .delegate()
$(elements).delegate( selector, events, data, handler );
在你的情况下
$('#employee_list').delegate( ".emp_delete", 'click', function() {
var ID=$(this).attr('id');
$("#delete_"+ID).show();
});
编辑2
对删除按钮也使用类似的语法
$('#employee_list').delegate( ".deleteBtn", 'click', function() {
});
关于javascript - AJAX/JQUERY 似乎无法删除数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21761121/