防止浏览器在提交表单时导航到操作 URL

Question

希望你们一切顺利。这可能是一个简单的问题，也是一个非常简单的解决方案，但我有点陷入这个问题，不太确定如何摆脱它。希望，如果你们中有人能帮忙的话。问题如下，

我有一个包含 3 个输入、文件 + 2 个文本输入的表单。表单的代码如下，

<form id="image_upload_form" enctype="multipart/form-data" method="POST">
   Select File : <input type="file" id="image_file" /><br>
   Time to Display :<input type="text" id="time_to_display" /><br>
   Sequence No: <input type="text" id="sequence_no" />
</form>

该表单出现在 jQuery 的对话框内，因此当我按下对话框上的“保存”按钮时，它会提交值。其代码如下，

$( "#someDivDialogBox" ).dialog({
    autoOpen: false,
    height: 300,
    width: 576,
    modal: true,
    buttons: {
        Save: function() {
             $("#image_upload_form").submit(function(e) {
                  var url = Util.getBaseURL() + "Uploads/Images?sid=" + Math.random();                        
                  $(this).attr("action", url);
             });

             $("#image_upload_form").submit();

        },
        Cancel: function() {
             // Do Something Here

        },
        close: function() {
             $(this).hide();
        }
     }
});

提交后，一切都按计划进行，数据保存在数据库中并返回成功消息，但是浏览器导航到操作 URL，而不是停留在表单所在的位置。如何阻止浏览器导航到表单的操作 URL。

希望信息足够，非常感谢任何帮助。非常感谢并等待您的回复。提前致谢。

问候

Answer 1

您需要调用已传递到提交处理程序中的preventDefault()事件 ( )：e

$("#image_upload_form").submit(function(e) {
    e.preventDefault();
    ...
});