DEMO

Question

我的表单中定义了两个按钮（保存，发布）。如果我点击“保存”＃39;然后发布＆＃39; ，发布按钮不起作用。这里的问题是，保存功能正常工作。但是，当点击“发布”时，会发生什么呢？它会尝试submit表单，而不是validate定义在＆quot;发布＆＃39;之下的表单。功能，它去保存＆＃39;函数的验证功能和进一步的过程。我想知道为什么它跳过它并跳转到“保存”＃39;功能验证过程？

示例代码;

形式：

<form class="form-horizontal" method="POST" id="manage_form">
    <div class="form-actions" id="saveButtons"> 
        <button class="btn btn-primary" id="save"/>save</button>
        <% if (outputs.isPermitted) { %> 
            <a class="btn btn-info" id="publish">Publish</a>  
        <% } %>
    </div>
</form>

Jquery的

// cache var to eliminate unnecessary re-querying

var $ manageForm = $（＆＃39;＃manage_form＆＃39;）;

$('#save').click(function (e) {
   var v = $("#manage_form").validate({
            submitHandler: function(form) {
            if(!validate_tiers()){
                return false;

            }
            var designer = APIDesigner();
            $('#swagger').val(JSON.stringify(designer.api_doc));
            $('#saveMessage').show();
            $('#saveButtons').hide();
            $(form).ajaxSubmit({
                success:function(responseText, statusText, xhr, $form) {
            //............
        });
    $("#manage_form").submit();
    });



    $('#publish').click(function(e){

    alert('xxx');
    e.preventDefault();
        var v = $("#manage_form").validate({

            submitHandler: function(form) {
             if(!validate_tiers()){
                return false;
            }
            var designer = APIDesigner();
            $('#swagger').val(JSON.stringify(designer.api_doc));
            $('#saveMessage').show();
            $('#saveButtons').hide();        
            $(form).ajaxSubmit({
                success:function(responseText, statusText, xhr, $form) {
                    $('#saveMessage').hide();
                    $('#saveButtons').show();                
                    if (!responseText.error) {  

                        $( "body" ).trigger( "api_saved" );       
                    } else {
                         if (responseText.message == "timeout") {
                             if (ssoEnabled) {
                                 var currentLoc = window.location.pathname;
                                 if (currentLoc.indexOf(".jag") >= 0) {
                                     location.href = "index.jag";
                                 } else {
                                     location.href = 'site/pages/index.jag';
                                 }
                             } else {
                                 jagg.showLogin();
                             }
                         } else {
                             jagg.message({content:responseText.message,type:"error"});
                         }
                    }
                }, dataType: 'json'
            });
            }
        });
        alert('zzz');
      $manageForm.submit();
    });

Answer 1

阻止提交的默认表单行为。

编辑：您不想在提交处理程序中提交提交内容吗？

$(function() {
// cache var to eliminate unnecessary re-querying
var $manageForm = $('#manage_form');


  $('#save').click(function (e) {
      e.preventDefault();
      var v = $manageForm.validate({
          submitHandler: function (form) {
            $manageForm.submit();
          }
      });
   });

  $('#publish').click(function (e) {
      e.preventDefault();
      var v = $manageForm.validate({
          submitHandler: function (form) {
              alert('yyy');
              $manageForm.submit();
          }
      });
  });
});

Answer 2

阻止default submitting的{{1}}只使用：

form

为每个按钮使用不同的提交处理程序，这就是您想要的：

e.preventDefault();

$（＆＃34;＃形式＆＃34）提交（）;没有按预期工作

2 个答案:

DEMO