js 确定取消框

在JavaScript中，确定取消框通常是通过浏览器的confirm()函数来实现的。这个函数会弹出一个带有确定和取消按钮的对话框，并返回用户的选择。

基础概念

confirm()函数是JavaScript中的一个内置函数，用于显示一个带有消息和两个按钮（确定和取消）的对话框。用户点击确定按钮时，函数返回true；点击取消按钮时，返回false。

示例代码

let userConfirmed = confirm("你确定要继续吗？");

if (userConfirmed) {
    // 用户点击了确定按钮
    console.log("用户选择了确定");
} else {
    // 用户点击了取消按钮
    console.log("用户选择了取消");
}

优势

简单易用：confirm()函数是浏览器内置的，不需要额外的库或框架。
快速实现：可以在一行代码中实现一个确认对话框。

类型

confirm()函数只有一种类型，即带有确定和取消按钮的简单对话框。

应用场景

在用户执行某些可能带来严重后果的操作前，如删除文件、提交表单等，提示用户确认。
在需要用户明确同意或拒绝的情况下，如隐私政策确认等。

注意事项

confirm()函数会阻塞JavaScript的执行，直到用户做出选择。
由于confirm()函数的样式和行为在不同的浏览器中可能有所不同，因此在需要更复杂或自定义的对话框时，可能需要使用HTML、CSS和JavaScript来创建自定义的确认框。

自定义确认框

如果需要更复杂的确认框，可以使用HTML、CSS和JavaScript来创建。例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Custom Confirm Box</title>
    <style>
        .confirm-box {
            display: none;
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: white;
            border: 1px solid #ccc;
            padding: 20px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        }
        .confirm-box button {
            margin: 5px;
        }
    </style>
</head>
<body>
    <div class="confirm-box" id="confirmBox">
        <p>你确定要继续吗？</p>
        <button id="confirmYes">确定</button>
        <button id="confirmNo">取消</button>
    </div>
    <button onclick="showConfirmBox()">显示确认框</button>

    <script>
        function showConfirmBox() {
            document.getElementById('confirmBox').style.display = 'block';
        }

        document.getElementById('confirmYes').onclick = function() {
            document.getElementById('confirmBox').style.display = 'none';
            console.log("用户选择了确定");
        };

        document.getElementById('confirmNo').onclick = function() {
            document.getElementById('confirmBox').style.display = 'none';
            console.log("用户选择了取消");
        };
    </script>
</body>
</html>

这个示例展示了如何使用HTML、CSS和JavaScript创建一个自定义的确认框，可以更灵活地控制对话框的样式和行为。

页面内容是否对你有帮助？

有帮助

没帮助

如何使用Electron.js显示彼此相邻的自定义Windows消息框按钮

、、、、

我正在尝试使用Electron.js对话框showMessageBoxSync创建一个消息框。我希望按钮是‘取消’和‘覆盖和继续’。我希望当按钮为“取消”和“确定”时，它以与框相同的方式显示。当按钮为“取消”和“确定”时，按钮将并排显示：但是，当我尝试将按钮设置为“取消”和“覆盖和继续”时，消息框的显示方式有所不同：是否可以设置“覆盖和继续”按钮以与“确定”

浏览 1提问于2020-11-08得票数 0

回答已采纳

1回答

显示facebook信用api的应用程序错误

、、

如果我找到什么东西，我想把它打印回来给用户，状态为已退还或取消。老实说，我什么都试过了，但我就是不能让它用我的评论来代替一些愚蠢的错误信息。我的一些附加程序需要在购买之前构建特定的建筑物，但我不能通知用户:/我不想向我的php后端发出AJAX请求，以确定这个用户是否可以额外购买，如果他可以调用fbjs适当的方法。这太傻了。

浏览 2提问于2011-06-07得票数 1

1回答

在“警报确认”对话框中添加自定义按钮

、

当用户离开页面时，我使用Alertify js 1.6.1来显示对话框。除了确定和取消，我需要添加一个额外的按钮“继续”在警报js确认对话框。是否有添加自定义按钮功能的方法？

浏览 4提问于2016-03-15得票数 3

回答已采纳

1回答

Javascript确认框工作错误

、、、、

嗨，我所有的工作都是角js，我想在单击删除按钮时添加确认消息。>Delete</a> 这将显示“确定”和“取消”按钮和“确认”框，如果单击“确定”按钮，它将进入下一个进程，但如果单击“取消”按钮，则与“到同一进程确认”框没有隐藏相同(“确定”按钮将返回“真”，但“取消”按钮将返回“真”而不是“假”)。

浏览 4提问于2013-10-15得票数 0

回答已采纳

1回答

是否显示javascript确认对话框的自定义消息和按钮文本？

、

是否可以为按钮提供自定义消息，而不是取消/确定并提供我自己的文本？你知道他们是怎么实现这个的吗？它们的对话框就像是使用原生JS生成的一样！

浏览 3提问于2013-02-21得票数 2

回答已采纳

1回答

Dojo1.4阻塞是/否对话框替换window.confirm

、、、

需要对window.confirm()进行同步(阻塞)对话框替换。这个对话框将从应用程序的多个部分调用-因此需要适当的清理。我更喜欢所有的动态代码，这样我就可以在.js文件或html/jsp文件中包含这个新的对话框，但是最好能工作。

浏览 3提问于2012-11-24得票数 1

1回答

创建确定/取消对话框

、、

这应该很简单，但是我还不知道如何在enaml中做一个简单的OK/cancel确认对话框。有没有人能开导一下我？

浏览 2提问于2013-05-29得票数 2

2回答

如何在wpf (mvvm)中显示一个带有ok和cancel的对话框？

、、

我正在尝试显示一个对话与确定和取消按钮上的按钮单击。根据对话框的结果，我想在wpf中保存\取消操作。我不确定如何在wpf中显示对话框。有什么帮助吗？

浏览 2提问于2012-12-28得票数 0

回答已采纳

2回答

“是”或“否”是否正确作为回答按钮:您确定要取消吗

我有这个按钮，当用户按下取消时，会出现一个对话框，并询问:你确定要取消吗？哪个被认为是正确的按钮:是/否或取消/确定

浏览 1提问于2014-03-08得票数 0

1回答

如何从chrome扩展到浏览器页面模拟生成的"alert“或"confirm”操作

、、、

我在网页上有由警报或确认命令生成的框消息。在chrome扩展中，我需要点击这个框上的“确定”或“取消”(在网络浏览器中)。我发现这在内容脚本和js级别是不可能的，所以我搜索了ChromeDevTools协议，但在那里找不到解决方案。我如何解决我的问题？

浏览 44提问于2019-02-12得票数 0

回答已采纳

1回答

如何更改MFC对话框上按钮的标题

、、

我有一个带有小文本框和“确定”和“取消”按钮的MFC对话框。现在，在某些情况下，我想将“确定”和“取消”按钮的标题更改为“是”和“否”。

浏览 1提问于2014-08-27得票数 1

1回答

为什么确认对话框需要在ujs中单击两次？

、、、

现在我发现确认对话框需要"2次点击“才能使用(取消或确定按钮)。.无论是“取消”还是“确定”，都需要单击两次。：<script src="/

浏览 1提问于2012-07-29得票数 0

回答已采纳

2回答

使用确定/取消确认对话框

、、

因此，如果我返回true，我想显示一个确认对话框，询问用户是否要继续更新。 javascript确认对话框可能无法工作，因为我并不总是想要显示此对话框，仅当输入的值满足特定条件时才显示此对话框。

浏览 3提问于2012-04-10得票数 1

回答已采纳

1回答

模式确定/取消样式对话框

、、、

我是《使用Python和Qt进行快速图形用户界面编程- PyQt编程的权威指南》(2008)一书的一部分。我不理解的是，第163-165页 def __init__ (self, format, parent=None):... TypeError: __init__() takes at least 2 arguments (1 given)

浏览 5提问于2011-12-11得票数 1

回答已采纳

2回答

Javascript禁用我的回发

、

chkSelected" runat="server" AutoPostBack="True" OnCheckedChanged="chkSelected_CheckedChanged" /> 但我想在用户单击JS确认对话框时运行它，如果他们取消选中它，我想问他们是否确定，如果确定，则回发并运行我的服务器端代码。

浏览 1提问于2010-06-04得票数 0

回答已采纳

1回答

具有自定义按钮文本的确认框

、

当我们使用确认提示框时，它总是显示“确定”和“取消”按钮请务必提出任何解决方案

浏览 1提问于2013-12-02得票数 0

1回答

引导框确认-当选择OK时包括href

、、、、

当前，当我在超链接中包含href标记触发引导框时，不管我单击哪个确认按钮(取消或确定)，都会触发href。这是我的书柜js

浏览 2提问于2014-05-08得票数 1

回答已采纳

3回答

Android对话框关闭而不是取消

、、

dialog = new AuthDialog(context, dismissListener, cancelListener);} 我正在使用调试器，我看到当我取消时(使用后退按钮或在对话框外按下)，应用程序会取消对话框，而不是取消。

浏览 0提问于2011-11-29得票数 1

回答已采纳

2回答

如何在检查确认ok后淡入div

、

JS var answer = confirm('Federal law restricts sending ofid="inline2" style="width:650px;display: none; font-size:14px; overflow:scroll"> hello </div> 我只想在弹出框中打开这个框，在确认框中单击确定</e

浏览 2提问于2014-09-13得票数 0

1回答

提交后未执行Ajax.BeginForm OnSuccess

、

我试图使用jquery对话框来编辑WebGrid中的数据。在表单提交之前，所有事情都可以正常工作，浏览器不是返回到打开的当前页面，而是转到控制器操作的url。它在jquery对话框中打开视图。该对话框定义了两个按钮:更新按钮和取消按钮。单击“取消”按钮什么也不做。单击update按钮会将浏览器带到控制器url，以便使用项目id进行编辑操作。我已经定义了jquery.unobtrusive-ajax.js库，并且我在Web.config文件中添加了Web.config键，尽管我不确定它是否

浏览 3提问于2011-04-28得票数 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

js 确定取消框

基础概念

示例代码

优势

类型

应用场景

注意事项

自定义确认框

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐