Ajax DELETE请求似乎只删除列表中的第一个项目

我一直在重复使用这些代码进行不同的项目，但是对于这个项目来说，这似乎不起作用。 我正在使用Express和Mongoose，并使用它来存储大学课程详细信息列表。 这是Schema。

exports = module.exports = function(app, mongoose) { var moduleSchema = new mongoose.Schema({ pivot: { type: String, default: '' }, module_name: { type: String, required:true}, module_code: {type: String, required: true}, description: {type: String} }); moduleSchema.plugin(require('./plugins/pagedFind')); moduleSchema.index({ pivot: 1 }); moduleSchema.index({ module_name: 1 }); moduleSchema.index({ module_code: 1 }); moduleSchema.index({ description: 1 }); moduleSchema.index({ search: 1 }); moduleSchema.set('autoIndex', (app.get('env') === 'development')); app.db.model('Module', moduleSchema); }; 

删除请求是通过路由器这样做的：

 app.delete('/modules/delete/:id', require('./views/modules/index').delete); 

然后在./views/modules/index我有'删除'function写：

 exports.delete = function(req, res){ var workflow = req.app.utility.workflow(req, res); workflow.on('validate', function() { workflow.emit('deleteModule'); }); workflow.on('deleteModule', function(){ req.app.db.models.Module.findOneAndRemove({_id: req.params.id}, function(err){ if(err){ return workflow.emit('exception', err); } req.flash('success', 'Module Deleted!'); res.redirect('/modules/'); }); }); workflow.emit('validate'); }; 

所以要运行的function，我必须做这样的ajax调用：

 $(document).ready(function(){ $("#deleteModule").on('click', function(e){ e.preventDefault(); var deleteId = $('#deleteModule').data('delete'); $.ajax({ url: '/modules/delete/'+ deleteId, type:'delete', success: function(result){ console.log(result); }, error: function(error){ console.log(error); } }); window.location = '/modules/'; }); }); 

这里是显示项目列表的玉代码：

  ul.list-group each module, i in data li.list-group-item strong #{module.module_code} - #{module.module_name} hr p #{module.description} a(href='/modules/edit/#{module._id}', class='btn btn-primary') Edit a(id='deleteModule', data-delete='#{module._id}', class='btn btn-danger pull-right', href="#") Delete 

一切似乎工作，除了现在我只能通过用户界面删除页面顶部的项目，点击任何其他删除buttonredirect到顶部，没有任何反应。

Answer 1

由于id在HTML页面中必须是唯一的，因此使用class而不是id并绑定删除function，

 // use .deleteModule instead of #deleteModule $(".deleteModule").on('click', function(e){ e.preventDefault(); var deleteId = $(this).data('delete'); // here use this instead of using id #deleteModule $.ajax({ url: '/modules/delete/'+ deleteId, type:'delete', success: function(result){ console.log(result); }, error: function(error){ console.log(error); } }); window.location = '/modules/'; }); 

并在HTML模板中添加类deleteModule ，

 ul.list-group each module, i in data li.list-group-item strong #{module.module_code} - #{module.module_name} hr p #{module.description} a(href='/modules/edit/#{module._id}', class='btn btn-primary') Edit a(id='deleteModule', data-delete='#{module._id}', class='btn btn-danger pull-right deleteModule', href="#") Delete