Question

我试图做某种验证。所以我输入了一些文字。输入值传递给跨度。现在我想在此范围为空时禁用按钮。所以基本上如果我没有在输入中键入任何内容，则跨度为空并且按钮被禁用。当两个跨度都不为空时，则启用按钮。以下是我的代码。我发现我的第二个改变功能不起作用。有人可以帮帮我吗？

＆＃13;

$('#input').on('change keyup', function(){
  var value = $(this).val();
  $('#summary_a').html(value);
});

$('#input-b').on('change keyup', function(){
  var value = $(this).val();
  $('#summary_b').html(value);
});

$('.btn-final').prop("disabled", true);
$('.summary').on('change', function(){
      alert("test");
        $(this).each(function(){
            if ($(this).is(':empty')) {
                $('.btn-final').prop("disabled", true);
            } else {
                $('.btn-final').prop("disabled", false);
            }
        });
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">

<input type="text" id="input-b">

<p>a: <br> <span id="summary_a" class="summary"></span></p>

<p>b: <br> <span id="summary_b" class="summary"></span></p>

<input type="submit" value="send" name="submit-form-1" class="btn btn-yellow btn-final">

＆＃13;

Answer 1

您需要应用更清晰的方法，如下所示： -

工作代码段： -

$('#input').on('change keyup', function(){
  var value = $(this).val();
  $('#summary_a').html(value);
  checkempty(); // call a function
});

$('#input-b').on('change keyup', function(){
  var value = $(this).val();
  $('#summary_b').html(value);
  checkempty(); // call a function
});

$('.btn-final').prop("disabled", true);
function checkempty() {
  var $nonempty = $('.summary').filter(function() {
    return $(this).text() == ''
  }); // check for empty spans
  if ($nonempty.length > 0) { // if empty spans available
    $('.btn-final').prop("disabled", true); // disable button
  } else {
    $('.btn-final').prop("disabled", false); // otherwise enable it
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">

<input type="text" id="input-b">

<p>a: <br> <span id="summary_a" class="summary"></span></p>

<p>b: <br> <span id="summary_b" class="summary"></span></p>

<input type="submit" value="send" name="submit-form-1" class="btn btn-yellow btn-final">

工作jSFiddle： - https://jsfiddle.net/9a69nttj/

如果所有span元素都不包含文本，则jQuery禁用按钮

1 个答案: