Question

我有2个输入字段，一个已启用，一个已禁用，在启用的字段中输入至少6个字符后，应使用javascript启用第二个（禁用的字段）。

Answer 1

使用eventListener的另一种方法：

document.getElementById('enabled').addEventListener('keyup', function() {
  if (this.value.length >= 6) {
    document.getElementById('disabled').disabled = false;
  } else {
    document.getElementById('disabled').disabled = true;
  }
});

<input type="text" id="enabled" placeholder="Type here...">
<input type="text" id="disabled" disabled>

Answer 2

$("#input1").keydown(function() {
  if($(this).val().length > 6) {
    $("#input2").attr('disabled', false)
  }
});

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<form>
  <input type="text" id="input1" />
  <input type="text" id="input2" disabled /> 
</form>

Answer 3

要执行此操作，您可以在第一个输入上使用input事件处理程序，然后根据提供的值使用prop()启用或禁用第二个输入。

可以使用keyup或keydown事件处理程序，但是请注意，仅使用鼠标从输入中添加内容或从输入中删除内容时，它们将不起作用。

尝试一下：

$('#enable').on('input', function() {
  $('#disable').prop('disabled', $(this).val().length < 6);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="inputContainer">
  <input type="text" id="enable" name="online-id" value="" class="focus sprite-clear_input_icns" placeholder="Online ID" />
</div>

<div class="inputContainer">
  <input type="password" id="disable" class="masked" name="passcode" value="" placeholder="Passcode" disabled="true" readonly />
</div>

Answer 4

使用prop启用通过length禁用文本。

$("#target1").keyup(function() {
  var len = $('#target1').val().length;
  if (len >= 6)
    $("#target2").prop('disabled', false);
  else
    $("#target2").prop('disabled', true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='target1' />
<input type='text' id='target2' disabled/>

一旦其他输入字段至少填充了6个字符，如何删除“禁用”属性

4 个答案: