Question

我想用jQuery添加带有占位符内容的标签。但是我不明白它为我生成大量标签的原因，好像循环只有在发生其他事情之后才关闭或停止

这是我之前的 html

<div class="column one">
<span class="wpcf7-form-control-wrap nome">
<input type="text" placeholder="Nome e Cognome*" style="font-size: 16px; line-height: 20px;">
</span>
</div>

这是 html之后：

<div class="column one">
<span class="wpcf7-form-control-wrap nome">
<input type="text" name="nome" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required resizedFontJQ" aria-required="true" aria-invalid="false" placeholder="Nome e Cognome*" style="font-size: 16px; line-height: 20px;">
    </span> 
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
    <label class="addedLabel">Nome e Cognome*</label>
</div>

我使用的 jQuery ：

jQuery(".wpcf7 .column input").each( function () {
      var inputTextLabel= jQuery(".wpcf7 .column input").attr("placeholder")
      jQuery(".wpcf7 .column input").closest("div").append("<label class='addedLabel'>" + inputTextLabel + "</label>");
    });

Answer 1

看看你的逻辑。

对于每个与选择器匹配的元素，您要向所有与jQuery(".wpcf7 .column input").closest("div")匹配的元素附加一些HTML。

每次循环时都需要注意特定的元素。

jQuery(".wpcf7 .column input").each( function (index, element) {
  var $element = $(element);
  var inputTextLabel= $element.attr("placeholder")
  $element.closest("div").append("<label class='addedLabel'>" + inputTextLabel + "</label>");
});

Answer 2

您可以尝试以下方法：

HTML

import axios from 'axios'
import constants from './constants'

const localApi = axios.create({
    baseURL: constants.API_BASE_URL,
    withCredentials: true
});

export default localApi;

JS

<div class="column one">
  <span class="wpcf7-form-control-wrap nome">
    <input type="text" placeholder="Nome e Cognome*" style="font-size: 16px; line-height: 20px;">
  </span>
</div>

使用输入占位符添加标签

2 个答案: