自動的に保存ボタンを有効にする方法

Question

ユーザーがチェックボックスをオンにし、入力フィールドにテキストを書き込むときにのみ、この保存ボタンを自動的に有効にします。私はここに何が欠けているのか、同じことをする代替方法があるのか​​分かりません。

jQuery("input[type='text']").on("keyup", function() { 
 
    validate(); 
 
}); 
 

 
function validate(){ 
 
    jQuery("input[type='text']").each(function(){ 
 

 
    if (jQuery(this).val() != "") 
 
    { 
 
     if((jQuery("#groupidtext").val() !="") && (jQuery(".cate").is(':checked'))) 
 
     { 
 

 
     jQuery("#save_me").removeAttr("disabled"); 
 
     } 
 
     else { 
 
     jQuery("#save_me").attr("disabled", "disabled"); 
 
     } 
 
    } 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="groupidtext" type="text" maxlength="50" /> 
 
<input class="cate" type="checkbox"/><label for="1">One</label> 
 
<input type="submit" disabled="disabled" id="save_me" value="Save"/>

Answer 1

あなたのコードあなただけのチェックボックスの変更にも聞くことがてきた細かいです：

jQuery("input[type='checkbox']").on("change", function() { 
    validate(); 
}); 

注：それは代わりにkeyupのinputイベントを使用する方が効率的ですinputのユーザー変更を追跡すると

jQuery("input[type='text']").on("input", function() { 
    validate(); 
}); 

これが役に立ちます。

jQuery("input[type='text']").on("input", function() { 
 
    validate(); 
 
}); 
 

 
jQuery("input[type='checkbox']").on("change", function() { 
 
    validate(); 
 
}); 
 

 
function validate(){ 
 
    jQuery("input[type='text']").each(function(){ 
 

 
    if (jQuery(this).val() != "") 
 
    { 
 
     if((jQuery("#groupidtext").val() !="") && (jQuery(".cate").is(':checked'))) 
 
     { 
 

 
     jQuery("#save_me").removeAttr("disabled"); 
 
     } 
 
     else { 
 
     jQuery("#save_me").attr("disabled", "disabled"); 
 
     } 
 
    } 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <input id="groupidtext" type="text" maxlength="50" /> 
 
    <input class="cate" type="checkbox"/><label for="1">One</label> 
 
    <input type="submit" disabled="disabled" id="save_me" value="Save"/> 
 

 
</form>