在jQuery功能之前運行Javascript函數

我試圖能夠讓我的表單檢查2個輸入框在提交之前是否有任何數據輸入。我有這個麻煩的原因是因爲我使用以下 -在jQuery功能之前運行Javascript函數

$('form.ajax').on('submit', function() { 
    var that = $(this), 
     url = that.attr('action'), 
     method = that.attr('method'), 
     data = {}; 

    that.find('[name]').each(function (index, value) { 
     var that = $(this), 
      name = that.attr('name'), 
      value = that.val(); 

     data[name] = value; 
    }); 

    $.ajax({ 
     url: url, 
     type: method, 
     data: data, 
    }) 
    this.reset(); 
    return false; 
});

這使得這樣的形式，而無需刷新頁面提交，我也有一個圖像出現幾秒鐘，當提交按鈕已被按下 -

$(".bplGame1Fade").click(function(){ 
$("#bplGame1ThumbUp").fadeIn(1000); 
$("#bplGame1ThumbUp").fadeOut(1000); });

我不希望這些運行，除非兩個輸入框中都有數據。我嘗試過使用OnClick（）和OnSubmit（）。在使用這些消息時，出現的消息表明它不是我想要的有效條目，但是一旦您單擊確定，表單將繼續提交。

是否有無論如何我可以運行一個JS函數來檢查輸入框，如果其中一個框是空的，取消提交。

任何幫助，將不勝感激，

謝謝。

來源

2013-10-13 RJSmith92

那麼你爲什麼不在ajax請求之前檢查它？我錯過了什麼？ – Dvir

我這樣做，但ajax請求仍然繼續。我應該指出，我是一個初學者，並從一個在線源獲得jQuery代碼。 – RJSmith92

爲什麼不只是添加一個if條件來檢查你是否得到一個空輸入？如果函數無效，可以返回該函數。

$('form.ajax').on('submit', function() { 
    var that = $(this), 
     url = that.attr('action'), 
     method = that.attr('method'), 
     data = {}; 

    var context = this; 
    var valid = true; 
    var total = that.find('[name]').length; 
    that.find('[name]').each(function (index, value) { 
     var that = $(this), 
      name = that.attr('name'), 
      value = that.val(); 
     if (!value) { 
      valid = false; 
      return; 
     } 
     data[name] = value; 
     if (index === total - 1) { //last item 
      if (valid) { 
       $.ajax({ 
        url: url, 
        type: method, 
        data: data, 
       }); 
       context.reset(); 
      } 
     } 
    }); 
});

編輯：你可以把ajax調用放在foreach中。因此，在最後一項中，如果每個輸入都有一個值，則可以調用ajax。

來源

2013-10-13 21:12:50 jbarnett

在jQuery功能之前運行Javascript函數

回答

相關問題