- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个带有提交和取消按钮的表单,我想在单击哪个按钮之前显示不同的 confirm
消息,所以这就是我想出的。
function confirmDialog(buttonId) {
switch (buttonId) {
case "cancel":
var result = confirm("cancel message");
submitForm(result);
break;
case "submit":
var result = confirm("Submit message");
submitForm(result);
break;
}
};
我的submitForm
函数看起来像
function submitForm(result) {
console.log(result); //this is false when I click cancel in the confirm box
if (result && $("#myform").valid()) {
$("#myform").submit();
}
else {
return false;
}
};
现在我的问题是,当我单击取消时,表单仍然被提交。有人可以告诉我我做错了什么吗?我的 else
条件中有 return false;
所以我真的不知道为什么它仍然提交表单。
我看过以下问题,但我仍然面临这个问题
jQuery Still Submits Ajax Post Even When “Cancel” is clicked on Confirm Dialog
javascript confirm (cancel) still submits form when returning false
编辑:按要求取消按钮html
<button type="submit" id="cancel" class="btn btn-danger btn-block" value="Cancel">Cancel</button>
进一步编辑
我在相应按钮的点击事件中调用了 confirmDialog
函数,如下所示:
$("#cancel").click(function () {
var buttonId = $(this).attr("id");
confirmDialog(buttonId)
});
最佳答案
你的按钮有默认的提交行为
替换
<button type="submit" id="cancel" class="btn btn-danger btn-block" value="Cancel">Cancel</button>
与
<button id="cancel" class="btn btn-danger btn-block" value="Cancel">Cancel</button>
...更新后编辑试试这个代码....
替换你的代码
function submitForm(result) {
console.log(result); //this is false when I click cancel in the confirm box
if (result && $("#myform").valid()) {
$("#myform").submit();
}
else {
return false;
}
};
与
function submitForm(result) {
console.log(result); //this is false when I click cancel in the confirm box
if (result && $("#myform").valid()) {
$("#myform").submit();
}
else {
const element = document.querySelector('myform');
element.addEventListener('submit', event => {
event.preventDefault();
console.log('Form submission cancelled.');
});
}
};
----- 如果您考虑更改您的 HTML 结构,则替代工作代码 ---
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
</head>
<body>
<form id="MyForm">
<button id="btnSubmit" class="btn btn-primary">Submit</button>
<button id="btnCancel" class="btn btn-danger">Cancel</button>
</form>
<script type="text/javascript">
$(function () {
$("#btnSubmit").click(function (e) {
e.preventDefault();
$('#MyForm').submit();
});
$("#btnCancel").click(function (e) {
e.preventDefault();
var result = confirm("Sure Cancel?");
if (result) {
const element = document.querySelector('#MyForm');
element.addEventListener('submit', function (e) {
e.preventDefault();
});
alert("Form Submission Canceled");
}
else {
$("#MyForm").submit();
alert("Form Submitted");
}
});
})
</script>
</body>
</html>
关于javascript - 取消确认仍然提交表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42695400/
TCP header 上的 32 位确认字段,比如 x告诉另一台主机“我收到了所有字节,直到并包括 x-1,现在期待来自 x 和 on 的字节”。在这种情况下,接收方可能已经收到了一些更多字节,比如
我正在使用 PyCharm 2020.2.3 不知不觉中我点击了下图中的复选框 现在,即使我的代码正在调试中,点击运行也会终止调试并开始运行代码。如何将其恢复为未选中状态?谢谢。 PS:我的“允许并行
我想知道何时使用 RabbitMQ 和 Spring Boot 接受 (ack) 或不接受 (nack) 消息。 我想将消息发送到队列(通过交换)并检查队列是否已接受该消息。实际上我想发送到两个不同的
我一直在寻找一种方法让用户确认 票在分配给他们之后。不知道有没有 这是一个内置功能,或者如果有一个插件 将为用户创建一个状态/按钮以接受票证 在它被放入队列之后。我希望 从附近的售票窗口看到类似的东西
我正在构建一个应用程序以通过 Xbee API 与 Xbee 模块通信。 目前我有一些工作,但它相当简单并且有很多限制。 Sub processPackets() ' this runs as its
我有一个复选框,更改后会自动发布。 自动发布对于两者(选中和未选中)都适用,但我想在每个事件发生之前弹出一个对话框进行确认。 到目前为止,当选中该复选框时,弹出框就会起作用。 但当取消选中该复选框时,
当我使用 UIGestureRecognizer ,例如,当用户向右滑动时,我想要一个 UIAlertView询问他是否真的要进行向右滑动的 Action 。 我曾尝试这样做,但没有成功。 最佳答案
我有一个 asp:CheckBoxList,我想显示一条警告消息仅在使用 jquery 取消选中复选框时。 $('.chklist').click( function () {
我想知道有什么可能的方法来确定我们的推送消息是否最终从 APNS 服务器传送。我已经想出了一些信息,如下所述 APNS 正在发送接受推送请求的响应代码,并可能给出错误代码(如果有)。例如:如果您的有效
我有此页面,我正在尝试确认输入文本字段中的日期与当前日期。如果输入字段中的日期晚于当前日期,则需要出现确认框以确认他们输入了正确的日期。因此,“确定”按钮需要完成数据提交,“取消”按钮需要将它们返回到
我有一个功能: function placeOrder(price, productList) { var bulletinBoardItem = Number(productList.box
我不明白为什么即使我点击“否”,这个confirm()调用也会被触发。你能告诉我我做错了什么吗? $('.deleteButton').livequery('click',function(){
我目前正在使用 dotmailer 生成一个新表单(简单的文本框和提交按钮),自动将电子邮件地址添加到 dotmailer 地址簿。 当有人提交电子邮件地址时 - 他们可以被带到网页。 我一直在尝试
这是不起作用的代码...它只是删除表单而不先提示。 $(".delete").click(function () { if(confirm('You honestly want to dele
我在我的程序中使用 aprgeparse 创建一个参数,允许用户从 amazon s3 存储桶中删除文件。我以这种方式创建它: parser.add_argument("-r", "--remove"
我正在努力学习 puppeteer 操作。我已经成功编写了登录页面和一些导航的脚本。然后我让它点击一个按钮。该页面抛出一个 window.confirm,我希望我的脚本接受它以继续下一步,但我不知
某网站实现了一个第三方插件,提示用户在删除前进行确认。 confirmDelete: function (event) { var go_ahead = confirm("Are you su
我想在 primefaces 的选择/取消选择复选框上显示确认对话框。我试过了 但它不起作用,因为 selectBooleanCheckBox 不可确认。是否有解决此问题的解决方法? 最
我们已经从 TFS 下载了一个项目,在恢复 Nuget 包后,我们收到以下错误: Error 5 The "ValidatePackageReferences" task could not
我有两个单独的 ul 列表:列表 A 和列表 B 由于 jQuery UI 插件,它们都可以排序。 我正在开发的项目的用户希望在项目从一个列表移动到另一个列表时确认操作,但在同一列表内移动时则不需要。
我是一名优秀的程序员,十分优秀!