如何将html中的confirm按钮文字修改为自定义文字?
时间: 2024-02-03 10:03:55 浏览: 268
修改按钮文字
Javascript中的confirm对话框无法直接更改按钮文字。但是你可以使用自定义的模态框来实现类似的效果。以下是一个简单的示例:
```html
<!-- 模态框 -->
<div class="modal" id="confirm-modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">确认</h5>
<button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
你确定要执行这个操作吗?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary" id="confirm-btn">确定</button>
</div>
</div>
</div>
</div>
<!-- 触发模态框的按钮 -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#confirm-modal">执行操作</button>
<script>
// 监听确认按钮的点击事件
document.getElementById('confirm-btn').addEventListener('click', function() {
// 执行确认操作
// ...
// 关闭模态框
$('#confirm-modal').modal('hide');
});
</script>
```
在这个示例中,我们使用了Bootstrap框架中的模态框组件,自定义了模态框的标题、内容和按钮文字。在Javascript中,我们监听了确认按钮的点击事件,并在点击确认按钮时执行了确认操作。
阅读全文