您可以使用 Layer UI 库来实现询问弹窗,以下是实现的步骤:
- 首先,将 Layer UI 库文件和样式表添加到您的 HTML 文件中。
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layer-ui@2.0.0/dist/css/layer.css">
<script src="https://cdn.jsdelivr.net/npm/layer-ui@2.0.0/dist/js/layer.js"></script>
- 创建一个按钮,并在点击时触发弹窗。您可以使用
layer.confirm()
方法来创建询问弹窗。
<button onclick="showConfirm()">询问弹窗</button>
<script>
function showConfirm() {
layer.confirm({
title: '确认删除?',
content: '您确定要删除这条记录吗?',
btn: ['删除', '取消'],
yes: function(index, layero) {
// 点击删除后的操作
layer.close(index);
},
btn2: function(index, layero) {
// 点击取消后的操作
layer.close(index);
}
});
}
</script>
- 在
layer.confirm()
方法中,您可以设置弹窗的标题、内容、按钮文本以及按钮点击后的回调函数(yes
表示第一个按钮点击后的回调函数,btn2
表示第二个按钮点击后的回调函数)。在回调函数中,您可以执行相应的操作,例如关闭弹窗或者发送 AJAX 请求等。
通过上述步骤,您就可以实现一个询问弹窗了。需要注意的是,Layer UI 库还提供了许多其他类型的弹窗,例如消息提示框、加载层等,您可以根据自己的需求进行选择和使用。