如果所有輸入和textarea都是空的，除了一個是空的，則禁用表單提交按鈕

只有當每個輸入字段的值都爲1時，才需要啓用提交按鈕。除了一個。如果所有輸入和textarea都是空的，除了一個是空的，則禁用表單提交按鈕

HTML：

// start of form 
<input type='text /> // cant be blank 
<input type='text /> // cant be blank 
<input type='text /> // cant be blank 
<textarea type='text /> // cant be blank 
<button type='submit'>Submit</button> 
// end of form 
<input id='subscription-input' type='text /> // exclude this one only 
[...]

JS：

function doCheck(){ 
    var allFilled = true; 
    $('input[type=text]').not('#subscription-input').each(function(){ 
     if($(this).val() == ''){ 
      return false; 
     } 
    }); 
    if (allFilled) { 
    // Apply active css and enable button 
    $('button[type=submit]').removeClass('form-submit--plain').addClass('form-submit--active'); 
    $('button[type=submit]').prop('disabled', !allFilled); 
    } 
} 

$(document).ready(function(){ 
    $('input[type=text]').keyup(doCheck).focusout(doCheck); 
});

基本上我需要一種方式來獲得的textarea場，所以我想加入wilecard（*）會工作：

$('*[type=text]').not('#subscription-input').each(function(){...}

如何獲取input和textarea字段？

來源

2017-07-10 Sylar

最初讓你按鈕禁用使用驗證插件，設置您的驗證規則和勾你的按鈕啓用腳本在其驗證的成功方法。 – amoeba

我認爲你應該在需要驗證的字段上給出一個類，並激活該按鈕。 –

使用$ .trim（....） – Aslam

應用同一類的所有字段，並把事件與該類一個not爲ID：

function doCheck() { 
 
    var allFilled = true; 
 
    $('.form-fields:not(#subscription-input)').each(function() { 
 
    if ($(this).val() == '') { 
 
     allFilled = false; 
 
    } 
 
    }); 
 

 
    $('button[type=submit]').prop('disabled', !allFilled); 
 
    if (allFilled) { 
 
    $('button[type=submit]').removeAttr('disabled'); 
 
    } 
 
} 
 

 
$(document).ready(function() { 
 
    doCheck(); 
 
    $('.form-fields').keyup(doCheck); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type='text' class='form-fields' /> 
 
<input type='text' class='form-fields' /> 
 
<input type='text' class='form-fields' /> 
 
<textarea class='form-fields'></textarea> 
 
<input id='subscription-input' class='form-fields' type='text' /> 
 
<button type='submit'>Submit</button>

來源

2017-07-10 10:28:18

變化代碼：

function doCheck(){ 
    var allFilled = true; 
    $('input[type=text]:not(#subscription-input),textarea').each(function(){ 
     if($(this).val() == ''){ 
      allFilled=false; 
     } 
    }); 
    if (allFilled) { 
    // Apply active css and enable button 
    $('button[type=submit]').removeClass('form-submit--plain').addClass('form-submit--active'); 
    $('button[type=submit]').prop('disabled', !allFilled); 
    } 
} 

$(document).ready(function(){ 
    $('input[type=text]').keyup(doCheck).focusout(doCheck); 
});

來源

2017-07-10 10:11:32

當第一個輸入有值時，按鈕現在啓用。 – Sylar

在這裏，你去與解決方案https://jsfiddle.net/ehjxvz4j/1/

function doCheck(){ 
 
    var allFilled = true; 
 
    $('input[type=text]').not('#subscription-input').each(function(){ 
 
     if($(this).val() == ''){ 
 
      allFilled = false; 
 
     } 
 
    }); 
 
    if($('textarea').val() == ''){ 
 
    \t allFilled = false; 
 
    } 
 
    if (allFilled) { 
 
    // Apply active css and enable button 
 
    $('button[type=submit]').removeClass('form-submit--plain').addClass('form-submit--active'); 
 
    } 
 
    $('button[type=submit]').prop('disabled', !allFilled); 
 
} 
 

 
$(document).ready(function(){ 
 
    $('input[type=text], textarea').focusout(doCheck); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type='text' /> 
 
<input type='text' /> 
 
<input type='text' /> 
 
<textarea></textarea> 
 
<button type='submit' disabled>Submit</button> 
 

 
<input id='subscription-input' type='text'/>

來源

2017-07-10 10:21:03 Shiladitya

如果所有輸入和textarea都是空的，除了一個是空的，則禁用表單提交按鈕

回答

相關問題