Question

这是我的jQuery：

var attr_index = 0;
$(document).on("propertychange keypress input paste", ".--variant-val-ul input:last", function (e) {
    var keyCode = e.keyCode || e.which;
    if (keyCode != 9) {
        $(this).closest('ul').append('<li><i class="icon-li icon-level-up icon-rotate-90 text-light"></i><input type="text" name="options[' + attr_index + '][]" placeholder="Attribute Option"> <a class="grey-link no-underline --remove" title="Remove"><i class="icon-remove"></i></a></li>');
    }

});

这是相关的HTML：

<ul class="icons-ul -li-margin-top-5 --variant-val-ul -v">
  <li>
    <i class="icon-li icon-level-up icon-rotate-90 text-light"></i>
    <input type="text" name="options[2][]" value="Small">
    <a class="grey-link no-underline --remove" title="Remove">
      <i class="icon-remove"></i>
    </a>
  </li>
  <li>
    <i class="icon-li icon-level-up icon-rotate-90 text-light"></i>
    <input type="text" name="options[2][]" value="Medium">
    <a class="grey-link no-underline --remove" title="Remove">
      <i class="icon-remove"></i>
    </a>
  </li>
  <li>
    <i class="icon-li icon-level-up icon-rotate-90 text-light"></i>
    <input type="text" name="options[2][]" value="Large">
    <a class="grey-link no-underline --remove" title="Remove">
      <i class="icon-remove"></i>
    </a>
  </li>
  <li>
    <i class="icon-li icon-level-up icon-rotate-90 text-light"></i>
    <input type="text" name="options[2][]" placeholder="Attribute Option">
    <a class="grey-link no-underline --remove" title="Remove">
      <i class="icon-remove"></i>
    </a>
  </li>
</ul>

在小提琴中，您会注意到只有当大小的最后一个输入具有值时才会出现新输入。这应该发生在<ul>

中的所有最后输入

有时这个HTML是通过jQuery动态生成的，当这个功能完成时，这个功能正常工作。它仅在HTML加载页面时不起作用。

Answer 1

将您的选择器更新为：

".--variant-val-ul li:last-child input"

http://jsfiddle.net/t7CKU/1/

这将选择input中包含的li last-child，li（每个列表中的最后{{1}}）。

当<ul>中的最后一个输入具有值</ul>时，添加新的<input />

1 个答案: