表單提交保持循環

單擊按鈕時，表單的提交被禁用。然後運行文本交換。完成文本交換後，取消的var將切換爲false，然後提交表單。

問題是，一旦form.submit（）觸發，它會循環並且文本不斷地淡入和淡出。這也導致表單不能提交。

<script type="text/javascript"> 
    var cancel = true; 

    $("#btn-submit").click(

    function() { 
     if (cancel == true) { 
      $('form').on('submit', function (ev) { 
       ev.preventDefault(); 
       form = $(".submit-form"); 
       fp = $('#free-planner'); 
       fp.fadeOut(350, function() { 
        fp.text('Check your email!'); 
       }); 
       fp.fadeIn(350, function() { 
        cancel = false; 
        if (cancel == false) { 
         form.submit(); 
        } 
       }); 
      }); 

     } 
    }); 
</script>

來源

2012-06-22 JakePump

如果您取消其默認操作 - 「提交」，您的表單如何提交？） – raina77ow

@ raina77ow似乎是'form.submit（）'的目標。這會觸發事件在首先應用用戶所需的提交邏輯之後提交表單。 – RobB

您正在通過將cancel變量設置爲false來創建循環，然後聲明只要它是false，就提交表單。

嘗試以下操作：

var cancel = true; 

$("#btn-submit").click(function() { 
    if (cancel == true) { 
     form = $(".submit-form"); 
     fp = $('#free-planner'); 
     fp.fadeOut(350, function() { 
      fp.text('Check your email!'); 
     }); 
     fp.fadeIn(350, function() {          
      if (cancel == true) { 
       cancel = false;   
       form.submit();      
      }     
     }); 
    } 
});

這稍微修改你的邏輯，以檢查是否取消變量沒有被修改，從它的原始狀態，真實的，那麼修改狀態爲false，然後提交表單。這導致表單只被提交一次。

此外，如果btn-submit然後提交按鈕更改輸入類型button，而不是submit，使這一變化意味着你不需要添加監聽器爲按鈕本身是爲了充當onSubmit事件提交事件。這也減輕了在該事件上調用preventDefault()的需要，因爲事件不會發生，直到以form.submit()觸發爲止。

來源

2012-06-22 17:21:07 RobB

我相信這是正確的軌道Rob，btn-submit是提交按鈕。我不確定如何以您建議的方式修改onSubmit事件。 onSubmit目前未設置。 – JakePump

使用你的方法修復了循環問題，但是表單仍然沒有提交。刪除preventDefault（）會導致表單在函數運行之前自動提交。 – JakePump

@JakePump - 刪除preventDefault（）只是它的一部分。附加部分是刪除onSubmit（）[$（'form'）。on（'submit'，function（ev）{]的事件偵聽器，並在可能的情況下將輸入類型從'submit'修改爲'button'。我已經更新了代碼片段以包含您提供的代碼的完整部分。 – RobB

表單提交保持循環

回答

相關問題