JSでいくつかの関数を結合するには？

-1

すべてのフィールドと塗りつぶし/選択した場合にのみ、送信ボタンをアクティブにする必要があります。JSでいくつかの関数を結合するには？

私はいくつかの例を見ましたが、それを行う方法はわかりません!!

$(document).ready(function() 
 
{ 
 
\t $('.envia').prop('disabled',true); 
 
\t $('#matricula').on('change', function() 
 
\t { 
 
\t \t $('#envia').prop('disabled', !$(this).val()); 
 
\t \t 
 
\t }).trigger('change'); 
 
}); 
 

 
$(document).ready(function() 
 
{ 
 
\t $('.envia').prop('disabled',true); 
 
\t $('#peca').on('change', function() 
 
\t { 
 
\t \t $('#envia').prop('disabled', !$(this).val()); 
 
\t \t 
 
\t }).trigger('change'); 
 
}); 
 

 
$(document).ready(function() 
 
{ 
 
\t $('.envia').prop('disabled',true); 
 
\t $('#quilometros').keyup(function() 
 
\t { 
 
\t \t $('#envia').prop('disabled', !$(this).val()); 
 
\t }).trigger('change'); 
 
}); 
 

 
$(document).ready(function() 
 
{ 
 
\t $('.envia').prop('disabled',true); 
 
\t $('#data').keyup(function() 
 
\t { 
 
\t \t $('#envia').prop('disabled', !$(this).val()); 
 
\t }).trigger('change'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
 
<form action="#"> 
 
<select id="matricula"> 
 
    <option></option> 
 
    <option value="1">Matricula 1</option> 
 
    <option value="2">Matricula 2</option> 
 

 
</select> 
 
<select id="peca"> 
 
    <option></option> 
 
    <option value="1">Peca 1</option> 
 
    <option value="2">Peca 2</option> 
 

 
</select> 
 
<input type="text" id="quilometros"> 
 
<input type="text" id="data"> 
 

 

 

 
<input type="submit" id = "envia" value="ok"></input> 
 
</form>

出典

2016-07-02 R Freitas

要素をチェックして値が元の値から変更されたかどうかを確認し、すべての要素が変更されている場合は、ボタンを有効にする「検証」関数を作成します。次に、すべての要素などのイベントハンドラでその関数を呼び出します。 – adeneo

あなたが持っている問題は、あなたが他のすべての状態を確認することなく、個々のフィールドに基づいて無効化を設定しているです。

値は

出典

2016-07-02 23:10:00 charlietfl

に設定されていないのはここ私は要素のコレクションの長さをチェックするためにfilter()を使用してい

$(function(){ 
    // pseudo selector `:input` will match all form controls 
    var $inputs = $('#form-id :input').on('change input',validate); 

    function validate(){ 
     var inValid = $inputs.filter(function(){ 
       return !this.value; 
      }).length; 
     $('#envia').prop('disabled', inValid); 
    } 
    // also call function on page load 
    validate(); 

});

をするたびに、あなたはすべてのために一つのイベントハンドラを使用することができますが、あなたはまた、すべてのコントロールをチェックする必要がありますこのヘルプあなた：

<html> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
    </head> 
 
    <body> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
 
     <script> 
 
      window.onload = fun; 
 
      function fun(){ 
 
       var matr = $("#matricula").val(); 
 
       var peca = $("#peca").val(); 
 
       var txt1 = $("#data").val(); 
 
       var txt2 = $("#quilometros").val(); 
 
       if(matr.length==0 || peca.length==0||txt1.length==0||txt2.length==0) 
 
        $("#envia").prop("disabled",true); 
 
       else 
 
        $("#envia").prop("disabled",false); 
 
        
 
      } 
 
     </script> 
 
      <form action="#"> 
 
      <select id="matricula" onchange="fun()"> 
 
       <option></option> 
 
       <option value="1">Matricula 1</option> 
 
       <option value="2">Matricula 2</option> 
 
      </select> 
 
      <select id="peca" onchange="fun()"> 
 
       <option></option> 
 
       <option value="1">Peca 1</option> 
 
       <option value="2">Peca 2</option> 
 
      </select> 
 
      <input type="text" id="quilometros" oninput="fun()"> 
 
      <input type="text" id="data" oninput="fun()"> 
 
      <input type="submit" id = "envia" value="ok"> 
 
      </form> 
 
     
 
    </body> 
 
</html>

出典

2016-07-02 23:12:11 Ehsan

ドキュメントの代わりに 'onload'が必要なのはなぜですか？そしてボタンの 'oninput'ですか？ – nnnnnn

そして、適切なイベントハンドラをインラインイベントハンドラと置き換えるのはなぜですか？ – adeneo

@nnnnnn tankyou私はそれを修正します。 – Ehsan

JSでいくつかの関数を結合するには？

答えて

関連する問題