var answer = window.confirm("Save data?");
if (answer) {
    //some code
}
else {
    //some code
}

使用window.conf而不是alert。这是实现该功能的最简单方法。

或者简单地：

<a href="https://some-link.com/" onclick="return confirm('Are you sure you want to go to that link?');">click me!</a>

用Yes和No按钮制作了一个超级简单的小香草js确认对话框。很遗憾我们不能定制本地的。

https://www.npmjs.com/package/yesno-dialog.

您可以使用JavaScript拦截onSubmit事件。

然后调用确认警报，然后获取结果。

与其他解决方案不同的另一个解决方案是使用新的对话框元素。您需要使用基于与其他元素交互的show或showModal方法。close方法可用于关闭打开的对话框。

<dialog>
  <button class="yes">Yes</button>
  <button class="no">No</button>
</dialog>

const dialogEl=document.querySelector（“对话框”）；const openDialog=document.querySelector（“button.open dialog”）；const yesBtn=document.querySelector（“.yes”）；const noBtn=document.querySelector（“.no”）；const result=document.querySelector（“.result”）；openDialog.addEventListener（“单击”，（）=>{dialogEl.showModal（）；});yesBtn.addEventListener（“单击”，（）=>{//以下行可以由您的DB查询替换result.textContent=“这可能是您的DB查询”；dialogEl.close（）；});noBtn.addEventListener（“单击”，（）=>{result.textContent=“”；dialogEl.close（）；});@导入url（'https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap'）；正文{字体系列：“Roboto”；}按钮{背景：hsl（206deg 64%51%）；颜色：白色；衬垫：0.5em 1em；边框：0无；光标：指针；}对话框{边框：0无；}.结果{页边距：1em；}<对话框><button class=“yes”>是</button><button class=“no”>否</button></dialog><button class=“open dialog”>单击我</button><div class=“result”></div>

我可以使用吗？

目前，与所有现代浏览器的兼容性都很好。

避免内联JavaScript——改变行为意味着编辑代码的每一个实例，这并不漂亮！

更干净的方法是在元素上使用数据属性，例如dataconfirm=“Your message here”。下面的代码支持以下操作，包括动态生成的元素：

a并单击按钮表单提交选项选择

jQuery：

$(document).on('click', ':not(form)[data-confirm]', function(e){
    if(!confirm($(this).data('confirm'))){
        e.stopImmediatePropagation();
        e.preventDefault();
    }
});

$(document).on('submit', 'form[data-confirm]', function(e){
    if(!confirm($(this).data('confirm'))){
        e.stopImmediatePropagation();
        e.preventDefault();
    }
});

$(document).on('input', 'select', function(e){
    var msg = $(this).children('option:selected').data('confirm');
    if(msg != undefined && !confirm(msg)){
        $(this)[0].selectedIndex = 0;
    }
});

HTML格式：

<!-- hyperlink example -->
<a href="http://www.example.com" data-confirm="Are you sure you want to load this URL?">Anchor</a>

<!-- button example -->
<button type="button" data-confirm="Are you sure you want to click the button?">Button</button>

<!-- form example -->
<form action="http://www.example.com" data-confirm="Are you sure you want to submit the form?">
    <button type="submit">Submit</button>
</form>

<!-- select option example -->
<select>
    <option>Select an option:</option>
    <option data-confirm="Are you want to select this option?">Here</option>
</select>

JSFiddle演示