Question

我有一个简单的HTML表单，允许用户输入字符串，并通过jQuery创建一个＆＃34;购物清单＆＃34;项目。

例如，用户以以下格式输入 oranges ：

<form id="js-shopping-list-form">
      <label for="shopping-list-entry">Add an item</label>
      <input type="text" name="shopping-list-entry" id="shopping-list-entry" placeholder="e.g., broccoli">
      <button type="submit">Add item</button>
    </form>

jQuery生成了这个片段：

<ul class="shopping-list">
        <li>
            <span class="shopping-item">oranges</span>
            <div class="shopping-item-controls">
              <button class="shopping-item-toggle">
                <span class="button-label">check</span>
              </button>
              <button class="shopping-item-delete">
                <span class="button-label">delete</span>
              </button>
            </div>
          </li>

有没有办法获取字符串（在这种情况下，＆＃34;橙子＆＃34;）并将其转换为id="oranges"内的ID <span class="shopping-item></span>？

基本上，我希望为每个新的.shopping-item范围分配一个唯一的标识符，以便我可以轻松跟踪它。

Answer 1

$('.shopping-item').eq(0).attr('id') = $('.shopping-item').eq(0).text();

这假设您只想为第一个执行此操作。如果您需要对shopping-list中的所有项目执行此操作，则可以遍历.shopping-item元素并使用this。

如何使用JS / jQuery将HTML元素的ID设置为与其内部文本相等？

1 个答案: