如何在啓用和禁用表單提交之間切換？

Question

這裏是皮包骨頭：在下面的代碼#new-org-btn是一個input類型submit，我希望它只提交form如果click函數達到else語句。截至目前，即使沒有達到else聲明，它也正在提交。

$('#new-org-btn').click(function() { 
    var newOrgName = $('#new-org-ipt').val(); 
    console.log(newOrgName.length);; 
    if (newOrgName.length == 0) 
    { 
     $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot be blank."); 
    } 
    else if (newOrgName.indexOf('-') == -1) 
    { 
     $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot contain any '-' characters."); 
    } 
    else 
    { 
     $('#new-org-output-msg').css('color', 'green'); 
     $('#new-org-form').submit();     
    }        
}); 

我知道，當它提交$('#new-org-form').submit(function() { return false; });將禁止從事任何形式，但問題是，如果我做

$('#new-org-btn').click(function() { 
    var newOrgName = $('#new-org-ipt').val(); 
    console.log(newOrgName.length);; 
    if (newOrgName.length == 0) 
    { 
     $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot be blank."); 
     $('new-org-form').submit(function() { return false; }); 

    } 
    else if (newOrgName.indexOf('-') == -1) 
    { 
     $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot contain any '-' characters."); 
     $('new-org-form').submit(function() { return false; }); 
    } 
    else 
    { 
     $('#new-org-output-msg').css('color', 'green'); 
     $('#new-org-form').submit();     
    }        
}); 

然後當我真正進入else語句，並要提交如往常一樣，它可能已從之前的函數調用中停用。因此，我需要一種「重新激活」表格的方法。我怎麼做？

Answer 1

我會做一個有點不同：

不要只檢查時提交，而不是點擊本身 - 這是既好提交按鈕和「ENTER」鍵將被處理：

$('#form').submit(function(ev) { 

     var newOrgName = $('#new-org-ipt').val(); 
     if (newOrgName.length == 0) 
     { 
      $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot be blank."); 
      ev.preventDefault(); 
     } 
     else if (newOrgName.indexOf('-') == -1) 
     { 
      $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot contain any '-' characters."); 
      ev.preventDefault(); 
     } 
     else 
     { 
      $('#new-org-output-msg').css('color', 'green'); 
     }        
    }); 

Answer 2

由於#new-org-btn是submit類型，因此它將提交不管。因此，你需要return false在if和else if

$('#new-org-btn').click(function() { 
     var newOrgName = $('#new-org-ipt').val(); 
     console.log(newOrgName.length);; 
     if (newOrgName.length == 0) 
     { 
      $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot be blank."); 
      return false; 
     } 
     else if (newOrgName.indexOf('-') == -1) 
     { 
      $('#new-org-output-msg').css('color', 'red').text("New organization not submitted. Name cannot contain any '-' characters."); 
      return false; 
     } 
     else 
     { 
      $('#new-org-output-msg').css('color', 'green'); 
      //$('#new-org-form').submit(); not need if new-org-form is the form itself     
     }        
    }); 

關於

> ...需要一種方法來 「激活」 的形式...

$('form')[0].reset();//may need to change selector if you have multiple forms 

應該做的訣竅。

見How to reset a form using jQuery with .reset() method