すべてのテキストフィールドが塗りつぶされている場合のみクラスを変更します

Question

すべてのテキストフィールドが塗りつぶされている場合にのみクラスを変更しようとしています。しかし、私が気づいたのは、ボタンがクラスを変更するたびに、それぞれのキーを押すことです。

jQueryの

$(document).ready(function(){ 

var $input = $('#city,#country'), 
    $register = $('#go'); 

    $register.attr('disabled', true); 
    $input.keyup(function() { 
     var trigger = false; 
     $input.each(function() { 
      if (!$(this).val()) { 
       trigger = true; 

      } 
     }); 
     trigger ? $register.attr('disabled', true) : $register.removeAttr('disabled'); 
     $('.toggle').toggleClass('save2 save') 
    }); 

HTML

<button class="toggle save" id="go">Save</button> 

Answer 1

あなたが条件文に包まれたこの行を持っていないため、ボタンのクラスは、すべてのkeyUpイベントで変化している：

$('.toggle').toggleClass('save2 save'); //note: you're missing the ; in your posted code. 

の場合トリガが真のときにのみクラスを変更し、それを条件にラップします：

if(trigger) { 
    $register.attr('disabled', true); 
    $('.toggle').toggleClass('save2 save'); 
} else { 
    $register.removeAttr('disabled'); 
} 

は、たとえば、以下のHTML

<input type="button" class="toggle" id="myBtn" value="My Button"> 
<input type="text" class="myText"> 
<input type="text" class="myText"> 

を与えjQueryのすべてのkeyUpイベントにクラスを変更します以下：

$('.myText').on('keyup', function() { 
    $('.toggle').toggleClass('save save2'); 
    console.log($('#myBtn').attr('class')); 
}); 

をしかし、あなたが条件で、クラスのトグルを包む場合、条件が真でない限り、トグルを防止します。

$('.myText').on('keyup', function() { 
    var trigger = true; 
    $('.myText').each(function() { 
    if (!$(this).val()) { 
     trigger = false; 
     return false; //break the loop - there's no need to continue looping 
    } 
    }); 
    if (trigger) { 
    $('.toggle').toggleClass('save save2'); 
    } 
    console.log($('#myBtn').attr('class')); 
}); 

ここにはFiddle Demoがあります。