在JS中需要解決方法：對象不是函數（調用form.submit（）時）

我必須使用的遺留系統是令人厭惡的PHP和Java的混合。 HTML由兩者生成。處理表單提交通常在Java中完成，例如在這種形式的情況下。在當前形式中，當服務器端驗證表單輸入時，需要一個名爲「submit」的元素。否則，它只是重新加載表單頁面。在JS中需要解決方法：對象不是函數（調用form.submit（）時）

這很好，直到管理層決定他們需要一個表單，該表單添加了一個複選框來確認一些合法的東西，並希望它在提交前在前端進行驗證。這是當所有的事情都破滅的時候。

您看到爲了在前端驗證我需要重寫基本HTML提交按鈕單擊並將其指向驗證函數。然後使用JS調用form.submit（）函數。不幸的是，在DOM中，這個功能被名爲「submit」的表單中的任何元素所覆蓋。

這是創建以下錯誤：「Uncaught TypeError：object is not a function」。

很明顯，這是由於有一個名爲「submit」的提交按鈕。

問題是，我不認爲我們可以編輯Java的這一方面不期望（我會明天會發現更多）。這是由於一個古老而複雜的，可怕的系統，當你打噴嚏時會打破。

所以我需要一個前端的解決方法，它允許我提交一個名爲「submit」和一個「Submit」值的表單輸入，並且仍然能夠使用JS驗證。

示例代碼：

<form class="disclosure-agreements" method="post" action="/" name="form_a"> 
    <input type="hidden" name="page" value="nda_agree"> 
    <input type="hidden" name="nda_agree_page" value="true"> 
    <input type="hidden" name="nda_agreed" value="true"> 

    <div style="margin-right: 10px; width: 410px; font-size: 10px;"> 
     <div class="blue-checkbox"> 
      <input type="checkbox" id="disclosure-agree" name="disclosure-agree"> 
      <label for="disclosure-agree"> 
       <span class="strong green-text large-text">I AGREE</span> By clicking this box to submit my application, I certify that I have read and agreed to all of the terms, conditions, provisions and disclosures contained in the blah blah blah 
      </label> 
     </div> 
    </div> 

    <div class="nda_btns"> 
     <div id="btn-wrapper" class="center"> 
      <button id="submit-btn" name="submit" class="green-bkgd" tabindex="" value="Submit" onclick="return false;" type="submit"> 
       <span class="primary-btn-text">Submit</span><br> 
       <span class="sub-btn-text">Apply Now</span> 
      </button> 

      <button id="cancel-btn" name="cancelbutton" class="red-bkgd" onclick="return false;"> 
       <span class="primary-btn-text">Cancel</span><br> 
       <span class="sub-btn-text">Do Not Apply</span> 
      </button> 
     </div> 
    </div> 
</form>

有了這個JS：

<script type="text/javascript"> 
$(document).ready(function() { 
    $('form.disclosure-agreements #submit-btn').click(function() { 
     if ($('form.disclosure-agreements input#disclosure-agree').is(':checked') === true) { 
      $('form.disclosure-agreements').submit(); 
      //document.createElement('form').submit.call(document.form_a); //I tried this too 
      return true; 
     } else { 
      alert("You must read and agree to the terms and disclosures before submitting."); 
      return false; 
     } 
    }); 
}); 
</script>

來源

2014-10-03 pthurmond

刪除onclick="return false;"的按鈕和$('form.disclosure-agreements').submit();

通話當你點擊按鈕，點擊處理程序返回false就足夠了（點擊將被取消，表格將不會被提交）

當-handler返回true形式將提交的click（也就是當你點擊提交按鈕默認動作，就沒有必要調用submit()）

來源

2014-10-03 23:30:55

這是最終解決問題的結果。感謝您的簡單答案。有趣的是，「返回虛假」的東西在不同的表單上工作，不需要名爲「提交」的元素 – pthurmond 2014-10-04 15:00:51

'return false'也適用於這裏，但它完全取消了按鈕的默認操作（發送表格）沒有任何條件。但是你需要這裏的條件（通過點擊處理程序實現）。 submit（）的調用不會受到'return false'的影響，但是你不能在這裏調用submit。 – 2014-10-04 20:47:36

的對象不是一個形式，你可以試試這樣的：

$('form').submit();

**或在您的情況下**

$(this).parents('form').submit(); // much safer to use no names, it is shorter and faster

這更好的=按鈕，點擊

當複選框未被選中時，也只返回false，不返回true。使用return; 要取消你需要做以下事件：

function(e) 
{ 
    if(<checked>) { 
    <submit form> 
    return; 
    } 

    try { 
    e.preventDefault(); 
    e.stopImmediatePropagation(); 
    e.stopPropagation(); 
    } catch(ee) {} 
    return false; 
}

但更好的方法是使用窗體$('form').on('submit', function(e) {});的「提交」事件並刪除onclick事件處理程序。

來源

2014-10-04 00:55:33 Codebeat

在JS中需要解決方法：對象不是函數（調用form.submit（）時）

回答

相關問題