javascript - 使用 jquery 删除循环内输入标签的禁用属性

标签 javascript jquery html loops input

我尝试使用循环和输入的 id 作为查询选择器来一一删除输入的禁用属性,但它没有按预期工作。我设法在没有循环的情况下完成它,但随后我必须为此编写 3 个不同的代码。请帮忙。谢谢。 编辑: keyup 事件将切换下一个输入字段上的禁用属性。例如,如果第一个输入不为空,则第二个输入字段的禁用属性将被删除。当第一个输入为空时,第二个输入将再次被禁用。这适用于第三个和第四个输入字段。

var inputs = $('input');
for (var i = 0; i < inputs.length; i++) {
 console.log('#'+inputs[i].id); //  print id1, id2, id3, id4
 console.log('#'+inputs[i+1].id); // print id2, id3, id4
 
   var x = '#'+inputs[i].id;
  var y = '#'+inputs[i+1].id;

$(x).keyup(function() {
    if ($(x).val() != '') {
      $(y).attr( "disabled", false );
    } else {
      $(y).attr("disabled", true);
    }
  })
  }
  
  // what I want my code to be like but in loops
  
  $("#id1").keyup(function() {
    if ($("#id1").val() != '') {
      $("#id2").attr( "disabled", false );
    } else {
      $("#id2").attr("disabled", true);
    }
  })

$("#id2").keyup(function() {
    if ($("#id2").val() != '') {
      $("#id3").attr( "disabled", false );
    } else {
      $("#id3").attr("disabled", true);
    }
  })

$("#id3").keyup(function() {
    if ($("#id3").val() != '') {
      $("#id4").attr( "disabled", false );
    } else {
      $("#id4").attr("disabled", true);
    }
  })
  
  
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="text" id="id1">
<input type="text" id="id2" disabled>
<input type="text" id="id3" disabled>
<input type="text" id="id4" disabled>

最佳答案

这就是你想要执行的操作吗?

$('input').keyup(function() {
  $(this).next('input').attr('disabled', false);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="text" id="id1">
<input type="text" id="id2" disabled>
<input type="text" id="id3" disabled>
<input type="text" id="id4" disabled>

如果是这样,则不需要使用 jQuery 循环。

关于javascript - 使用 jquery 删除循环内输入标签的禁用属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53865917/

相关文章:

jquery - IBM Worklight 6 - Windows 8 平板电脑附加功能异常

javascript - 我需要一个 "do not show again"按钮

javascript - HTML Canvas 不会画线

jquery - 使整个文档/正文不可点击

jquery - 文本区域中的新行将转换为 <br/>

javascript - 将本地 HTML 加载到 Div(Chrome 扩展)

iphone - 为什么我的网站在我的 iPhone Safari 浏览器上看起来不一样,是我做错了什么吗?

html - 如何在 Ruby on Rails 中添加背景图片

javascript - 发布请求以等待函数

javascript - 模板文字和无括号函数调用