【问题标题】:return true or false based on button clicked in pop up window根据在弹出窗口中单击的按钮返回 true 或 false
【发布时间】:2012-07-04 18:38:11
【问题描述】:
好的,所以我使用 jQuery 截获了表单的 .submit(),我想创建一个自定义弹出窗口,向他们显示输入的数据并要求他们确认。如果他们单击确认按钮,则 true 将返回到 .submit() 并继续,但如果按下 false,则他们不应继续前进并有机会更改其条目。
我已经让弹出窗口正常显示了表单的内容和按钮。我不知道该怎么做是绑定按钮的点击功能,这样如果一个被点击它返回 false 到 .submit() 并且如果另一个被点击 true 返回到 .submit()
如果您需要我发布我的一些代码,请告诉我。
我不想使用确认对话框,因为我希望它是一个自定义弹出窗口。
【问题讨论】:
标签:
javascript
callback
form-submit
【解决方案1】:
您需要使用confirm() 对话:
var submit = confirm('Are you sure?');
if (submit) {
$(this).submit();
}
else {
return false;
}
这是通过对话框向用户显示消息"Are you sure?"来实现的,如果用户单击确认ok按钮,则对话框将true返回给变量submit,否则返回false。
如果返回false(用户单击cancel),则if 的计算结果为false,并执行else。
【解决方案2】:
您需要将 .submit() 作为回调函数传递给对话。这不是单行解决方案,而是您应该熟悉的模式。这个http://www.youtube.com/watch?v=hQVTIJBZook 可能会对本主题的某些内容以及您可能遇到的其他常见问题有所帮助
例子:
function openPopup(form) {
//
// Put whatever code you use to open you
// popup here
//
// Bind click handler to submit form if they click confim
$("#id_of_confim_button").on("click", function() {
// Get the form that was
form.submit();
});
// Bind click handler for cancel button
$("#id_of_cancel_button").on("click", function() {
//
// Code to close your popup
//
});
};
$("#id_of_form_submit_button").on("click", function(event) {
// Stops the form from submitting
event.preventDefault();
// Get the form you want to submit
var form = $("#form_being_submit");
// Call your 'open custom popup' function and pass
// the form that should be submitted as an argument
openPopup(form);
});
【解决方案3】:
仅捕获此表单的提交'click 事件不会处理所有情况(例如,如果有人在非文本区域输入上按 Enter,则表单也会提交)。
如果我想以异步方式处理提交,我曾经在阻止原始文件后手动触发submit 并引入isDirty 状态:
(function () {
var isDirty = true;
$("form#id").on("submit", function ( evt ) {
if (isDirty) {
evt.preventDefault();
popup( "... params ...", function () {
// this will called, when the popup ensures the form can be submitted
// ... & it will be called by the popup
isDirty = false;
$("form#id").submit();
} );
}
});
})();