求助：HTML中点击提交按钮时显示消息的实现方法

你的代码核心问题是用了ondblclick（双击触发事件），但需求是单击触发；另外如果按钮在表单内，还要注意阻止表单默认的提交刷新行为，否则弹窗可能一闪而过。下面分两种情况给出解决代码：

一、普通按钮（不在表单内） #

直接将事件改为onclick即可：

<button onclick="myalert()">
    提交
</button>

<script>
    function myalert() {
        alert("订单已确认");
    }
</script>

二、表单内的提交按钮 #

如果按钮包含在<form>标签中，默认点击会提交表单并刷新页面，需要先阻止默认行为：

方法1：内联事件处理 #

<form>
    <button onclick="handleSubmit(event)">
        提交
    </button>
</form>

<script>
    function handleSubmit(event) {
        // 阻止表单默认提交刷新
        event.preventDefault();
        alert("订单已确认");
        // 若需要手动提交表单，取消下面注释
        // event.target.form.submit();
    }
</script>

方法2：分离式事件绑定（推荐，更易维护） #

<form id="orderForm">
    <button type="submit">
        提交
    </button>
</form>

<script>
    const orderForm = document.getElementById('orderForm');
    orderForm.addEventListener('submit', function(event) {
        event.preventDefault();
        alert("订单已确认");
        // 手动提交表单请取消注释
        // orderForm.submit();
    });
</script>

内容的提问来源于stack exchange，提问作者alan antony