Question

我想在我的javascript中获取唯一ID，因此，我进行循环并将其放在id的名称之后。这是我的HTML代码：

$(document).ready(function() {
  $('input[type="checkbox"]').on('click', function() {
    if ($(this).is(":checked")) {
      var a;
      for (a = 1; a < 300; a++)
        // if checked   add value
        $("#abc" + a).val($('#xyz' + a).attr('value'));
    } else {
      // if unchecked remove value
      $("#abc" + a).val("");
    };
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="checkbox" name="check1" id="check1" />
<input type="text" id="xyz1" name="xyz1" value="3" />
<input type="text" id="abc1" name="abc1" />

<input type="checkbox" name="check2" id="check2" />
<input type="text" id="xyz2" name="xyz2" value="5" />
<input type="text" id="abc2" name="abc2" />

这是我的javascript代码：

我在id名称后添加“a”，以便与文本生成相同的id。但它仍然没有运作良好.. 有人可以帮帮我吗？我真的很感激任何帮助： - ）

Answer 1

您的代码是正确的，先生： - ）

http://codepen.io/zer00ne/pen/dGKvBL/

您需要将其添加到头部：

log(xy) = log(x) + log(y)

Answer 2

我认为这应该可以解决问题：

$(document).ready(function () {
  $('input[type="checkbox"]').on('click', function() {
    for(var a = 1; a < 300; a++){
      if($(this).is(":checked")){
        // if checked   add value
        $("#abc"+a).val($('#xyz'+a).attr('value'));
      }else{
        // if unchecked remove value
        $("#abc"+a).val("");
      }    
    }
  });
});

更新：

考虑到问题中的更新代码，如果您有一个常见的模式，如复选框和2个字段重复，如问题中给出的那样，我建议您每次使用一个类而不是生成唯一ID。

<input class="chk" type="checkbox" name="check1" id="check1" />
<input class="xyzs" type="text" id="xyz1" name="xyz1" value="3"/>
<input class="abcs" type="text" id="abc1" name="abc1" />

<input class="chk" type="checkbox" name="check2" id="check2" />
<input class="xyzs" type="text" id="xyz2" name="xyz2" value="5"/>
<input class="abcs" type="text" id="abc2" name="abc2" />

现在jquery会是这样的：

$("input[type='checkbox']").on('click',function(){
  $(".chk").each(function(i,ch){
    var abc = $(".abcs");
    var xyz = $(".xyzs");
    if($(this).is(":checked")){
      $(abc[i]).val($(xyz[i]).val());
    }else{
      $(abc[i]).val(" ");
    }
  });
});

希望有所帮助

Answer 3

根据我的理解，以下代码导致问题

if ($(this).is(":checked")) {
  var a;
  for (a = 1; a < 300; a++)
    // if checked   add value
    $("#abc" + a).val($('#xyz' + a).attr('value'));
} else {
  // if unchecked remove value
  $("#abc" + a).val("");

如果您注意到，如果未选中$(this).is(":checked")，则a未定义，因此未设置值。此外，设置的条件应该是内部循环而不是在它之外

$(document).ready(function() {
  $('input[type="checkbox"]').on('click', function() {
    for (a = 1; a < 300; a++) {
      if ($(this).is(":checked")) {
        var a;
        // if checked   add value
        $("#abc" + a).val($('#xyz' + a).attr('value'));
      } else {
        // if unchecked remove value
        $("#abc" + a).val("");
      };
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="checkbox" name="check1" id="check1" />
<input type="text" id="xyz1" name="xyz1" value="3" />
<input type="text" id="abc1" name="abc1" />

<input type="checkbox" name="check2" id="check2" />
<input type="text" id="xyz2" name="xyz2" value="5" />
<input type="text" id="abc2" name="abc2" />

你可以尝试这样的事情：

而不是300次迭代的循环，您可以使用id进行搜索并分配值。您可以使用id

获取具有相似name或$([attribute^=value])的元素

$(document).ready(function() {
  $('input[type="checkbox"]').on('click', function() {
    var val = $(this).is(":checked") ? $(this).parent().find("[id^=xyz]").val() : "";
    $(this).parent().find("[id^=abc]").val(val);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div>
  <input type="checkbox" name="check1" id="check1" />
  <input type="text" id="xyz1" name="xyz1" value="3" />
  <input type="text" id="abc1" name="abc1" />
</div>

<div>
  <input type="checkbox" name="check2" id="check2" />
  <input type="text" id="xyz2" name="xyz2" value="5" />
  <input type="text" id="abc2" name="abc2" />
</div>

循环生成唯一的id javascript

3 个答案: