Question

以下代码是在我的#e_newsletter_email div中添加占位符。但是我已经为电子通讯添加了一个额外的注册框，并且占位符没有显示在第二个。有没有办法应用此代码在两个注册框上工作？

jQuery(function($) {
  $('#e_newsletter_email').attr( 'placeholder', 'You Email Address' );
});

我试图添加此代码以强制id添加一个类但是这只适用于第一个id。还有其他想法吗？

jQuery(function($) {
    $('#e_newsletter_email').addClass('e_newsletter_email');
});

由于

Answer 1

ID只能使用一次。对不需要唯一标识的元素使用类。

Answer 2

在@ mark.hch的一些帮助下，我们能够弄清楚如何创建一个变通方法。以下是最终代码：

<script type="text/javascript">

jQuery(function($) { 
 $('input').each(function() { if($(this).attr('id') == 'e_newsletter_email') { $(this).addClass('e_newsletter_email_custom'); } });
});

jQuery(function($) {
  $('.e_newsletter_email_custom').attr( 'placeholder', 'You Email Address' );
});

</script>

首先，我们需要遍历每个id并向e_newsletter_email添加一个新类（它被使用了两次）。然后，一旦我们将类添加到id，我们就能够更新原始函数以使用类而不是id，一切都完美无缺！

Answer 3

问题的真正答案是为两个字段使用类而不是ID。如评论中所述，ID应该对页面上的每个元素都是唯一的。但是，在这种情况下，元素只包含一个ID，然后问题就变成了如何向元素添加一个类，以便将来的选择器可以抓取所有（或两者）来操纵它们。

使用ID选择器$('#e_newsletter_email')只选择一个元素（因为jQuery假设只有一个元素具有该ID）。所以我们需要一个更通用的选择器 - 在这种情况下，两个元素都是输入，所以选择器$('input')应该至少抓住那些元素。

由于页面上的输入可能比有问题的输入多，我们需要过滤掉我们想要的输入;在这种情况下，我们比较元素的ID属性（因为我们知道，即使它们应该是唯一的，两个实际上包含相同的ID）。

即使有多个具有相同ID的元素，抓取元素的ID也会有效（$(this).attr('id')将始终显示元素的已分配ID，即使不是唯一的。）

所以代码变成：

//loop through all inputs
$('input').each(function() {
  //if the input currently iterating over has the ID in question
  if$(this).attr('id') == 'e_newsletter_email') {
    //add the class for the input
    $(this).addClass('e_newsletter_email_custom');
  }
});

WordPress - 具有相同类/ id的多个元素的jQuery函数

3 个答案: