,可以通过以下步骤实现:
delete
方法,以删除相应的记录。以下是一个示例代码,演示如何从动态创建的行中的按钮删除IndexDB中的记录:
// 创建IndexDB数据库
const request = indexedDB.open('myDatabase', 1);
request.onupgradeneeded = function(event) {
const db = event.target.result;
// 创建存储对象
const store = db.createObjectStore('myStore', { keyPath: 'id' });
// 添加一些示例记录
store.add({ id: 1, name: '记录1' });
store.add({ id: 2, name: '记录2' });
};
request.onsuccess = function(event) {
const db = event.target.result;
// 获取按钮元素
const deleteButtons = document.querySelectorAll('.delete-button');
// 为每个按钮添加点击事件监听器
deleteButtons.forEach(function(button) {
button.addEventListener('click', function(event) {
const recordId = event.target.dataset.recordId;
// 打开事务并获取存储对象
const transaction = db.transaction(['myStore'], 'readwrite');
const store = transaction.objectStore('myStore');
// 删除记录
const deleteRequest = store.delete(recordId);
deleteRequest.onsuccess = function() {
// 删除成功后的操作
console.log('记录删除成功');
};
deleteRequest.onerror = function() {
// 删除失败后的操作
console.error('记录删除失败');
};
});
});
};
在上述示例代码中,我们首先创建了一个名为myDatabase
的IndexDB数据库,并在onupgradeneeded
事件处理程序中创建了一个名为myStore
的存储对象。然后,我们为每个具有delete-button
类的按钮添加了一个点击事件监听器。在点击事件监听器中,我们获取了要删除的记录的唯一标识符,并使用该标识符打开了一个事务,并获取了存储对象。然后,我们使用唯一标识符调用存储对象的delete
方法来删除相应的记录。最后,我们在成功或失败的情况下执行相应的操作。
请注意,上述示例代码仅为演示目的,并未涉及具体的UI操作或错误处理。实际应用中,您可能需要根据具体需求进行适当的修改和补充。
领取专属 10元无门槛券
手把手带您无忧上云