jquery更改所有以前标签的文本

这是我的HTML

<div class="main_holder">
  <div class="input_holder">
    <label for="something">Some Label</label><br/>
        <input type="text" maxlength="255" class="cat_textbox" id="field_input" name="somename" /> 
  </div>
  <a href="#" class="add">Add+</a>

  <div class="input_holder">
    <label for="something">Some Label</label><br/>
        <input type="text" maxlength="255" class="cat_textbox" id="field_input" name="somename" /> 
  </div>
  <a href="#" class="add">Add+</a>

  <div class="input_holder">
    <label for="something">Some Label</label><br/>
        <input type="text" maxlength="255" class="cat_textbox" id="field_input" name="somename" /> 
  </div>
  <a href="#" class="add">Add+</a>
</div>

---

我的想法是，当我克隆一个字段时，我希望该字段显示它到底是哪个字段（是1、2、3等）。问题是我不能抓住我点击的按钮前的标签

您可以使用

closest（）

而不是

prevAll（）

，如下所示：

var increment=0;
$('a.add').click(function() {
  increment++;

  $(this).prev('.input_holder').clone().insertBefore(this).closest('.input_holder').find('label').text(increment);

  return false;
});

见工作

更新：
这是一个新版本，在每个

上放置一个属性。输入\u holder

以保持其增量：

$('a.add').click(function() {

   prevholder = $(this).prev('.input_holder');
   increment = prevholder.attr('data-increment');
   increment++;
   prevholder.attr('data-increment', increment);
   prevholder.clone().insertBefore(this).closest('.input_holder').find('label').text(increment);

   return false;
});

请参见工作

请参见：

---

我将把输入块封装到另一个div中。这使您有机会编写一些更简单的javascript代码

HTML

示例见此处：

---

顺便说一句，您应该区分输入字段的名称，并对有效的HTML代码使用不同的ID。

您是指选择器“.input_holder”？它不起作用，因为如果您单击下一个字段上的add（添加），它将继续从上一个字段开始递增，我希望每个字段都从1Ok开始，我已经用一个新版本更新了我的答案，该版本保留了每个

的单个增量。输入\u holder

，它们保存在一个属性中。

$('a.add').click(function() {

   prevholder = $(this).prev('.input_holder');
   increment = prevholder.attr('data-increment');
   increment++;
   prevholder.attr('data-increment', increment);
   prevholder.clone().insertBefore(this).closest('.input_holder').find('label').text(increment);

   return false;
});

$('a.add').click(function() {
  var val = $(this).prev('.input_holder').find('label:last').text();
  val = val == "Some Label" ? 1 : (parseInt(val) + 1);
     $(this).prev('.input_holder').clone().insertBefore(this).closest('.input_holder').find('label').text(val);

  return false;
});

<div class="main_holder">
  <div class="block_holder">
    <div class="input_holder">
      <label for="something">Some Label</label>
      <br/>
      <input type="text" maxlength="255" class="cat_textbox" id="field_input"
      name="somename" />
    </div> <a href="#" class="add">Add+</a>

  </div>
  <div class="block_holder">
    <div class="input_holder">
      <label for="something">Some Label</label>
      <br/>
      <input type="text" maxlength="255" class="cat_textbox" id="field_input"
      name="somename" />
    </div> <a href="#" class="add">Add+</a>

  </div>
  <div class="block_holder">
    <div class="input_holder">
      <label for="something">Some Label</label>
      <br/>
      <input type="text" maxlength="255" class="cat_textbox" id="field_input"
      name="somename" />
    </div> <a href="#" class="add">Add+</a>

  </div>
</div>

$(".main_holder").on("click", "a.add", function () {
    var count = $(this).closest(".block_holder").find("label").length;
    $(this).prev(".input_holder").clone().insertBefore($(this)).find("label").html(count);
    return false;
});