Javascript 选择后更改复选框标签

我有一些复选框（101），标签应该根据选择输入进行更改。jsi只运行一次，这是合乎逻辑的。虽然我不太熟悉jquery函数，但我不知道如何处理所有101个复选框

输入：

<?php

    for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
        echo '<div class="each_checkboxes">';
        //  $j = sprintf('%04u', $i);

        echo '<label id="contact" for="checkbox"></label>';
        echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';

        echo '</div>';

    endfor;
?>

---

您需要使用

class

而不是

id

，因为

id

对于每个元素都应该是唯一的。试着像下面这样

PHP:

<?php
    for ($i = 1; $i < 102; $i++): 

        echo '<div class="each_checkboxes">';

        echo '<label class="contact" for="checkbox'.$i.'"></label>';
        echo '<input type="checkbox" name="tape[]" id="checkbox'.$i.'" value=""/>';

        echo '</div>';

    endfor;
?>

$(document).ready(function () {
    $('#method').change(function () {
        var method = $('option:selected').val(),
            text = "";

        if (method == "server1") {
            text = "MA";
        } else if (method == "server2") {
            text = "SAS";
        }

        $('.contact').each(function (i) {
            var value = text + (++i);
            $(this).text(value);
            $('#' + $(this).attr('for')).val(value);
        });
    });
});

---

您在jQuery选择器中引用的是

id

属性，该属性只会在dom中查找第一个匹配项。您需要为标签分配一个类，并在更改标签文本时引用该类，然后这将起作用

<?php

  for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
      echo '<div class="each_checkboxes">';
    //  $j = sprintf('%04u', $i);

      echo '<label id="contact" class="contact" for="checkbox"></label>';
      echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';

      echo '</div>';

endfor;
  ?>

---

就是这样。

使用标签类而不是id

<?php

  for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
      echo '<div class="each_checkboxes">';
    //  $j = sprintf('%04u', $i);

      echo '<label class="contact" for="checkbox"></label>';
      echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';

      echo '</div>';

endfor;
  ?>

使用“类”作为复选框的标签，而不是“id”。基本上，元素的“id”应该是唯一的。但是类，多个元素可以具有相同的类

因此，标签应如下所示：

<label class="contact" for="checkbox"></label>

$('#method').change(
  function () {
      var method = $('option:selected').val();
      if (method == "server1") {
        $('.contact').text("MA" + i);
      } else if (method == "server2") {
        $('.contact').text("SAS" + i);
      }
});

---

你的问题不清楚。您的原始代码中可能存在任何其他问题。看这个@这是我仅有的代码。问题：它能识别jquery中相同的var“i”吗？不能。但是可以使用

each（）

方法。请参阅更新的答案。希望它能解决你的问题@很抱歉再次打扰你。。。但是我可以再问你一个问题吗，我如何将这个相同的值（例如MA23）传递给复选框值，以便我可以在DB中使用它。。。（将MA23存储在db中）好的，所以我添加了这个“$”（'.contact'）。每个（函数（I）{$（this）.text（text+++++I））；变量q=$（this.text（）；$（“[type=checkbox]”）.val（q）；}）；`但它总是给我最后一个（MA101）

<?php

  for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
      echo '<div class="each_checkboxes">';
    //  $j = sprintf('%04u', $i);

      echo '<label class="contact" for="checkbox"></label>';
      echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';

      echo '</div>';

endfor;
  ?>

 $(document).ready(function () {
    $('#method').change(
    function () {
        var method = $('option:selected',this).val();

        if (method == "server1") {

            $('.each_checkboxes label.contact').html("MA" + i);

        } else if (method == "server2") {

              $('.each_checkboxes label.contact').html("SAS" + i);

        }
    });

});

<label class="contact" for="checkbox"></label>

$('#method').change(
  function () {
      var method = $('option:selected').val();
      if (method == "server1") {
        $('.contact').text("MA" + i);
      } else if (method == "server2") {
        $('.contact').text("SAS" + i);
      }
});