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。

仅在填写所有文本字段时更改类

1 个答案: