javascript - jQuery 无法在输入中添加类

Question

我无法向此输入添加类:

这是 jQuery:

$( ".payment_nr" ).addClass( "highred" );

HTML:

<div>
<input id="email" class="payment_nr" type="email" placeholder="marco@polo.com">
</div>

这是我要添加的 CSS:

.highred{
-webkit-appearance: none;
-webkit-box-shadow: 0px 0px 7px 0px rgba(255,0,0,0.66);
-moz-box-shadow: 0px 0px 7px 0px rgba(255,0,0,0.66);
box-shadow: 0px 0px 7px 0px rgba(255,0,0,0.66);
}

奇怪的是，如果我将它应用到父对象，它就会起作用:

$( ".payment_nr" ).parent().addClass( "highred" );

此外，如果我直接添加纯 CSS，它会起作用:

$( ".payment_nr" ).css("background-color","yellow");

有人可以帮我使用外部 CSS 将其直接添加到输入中吗？

Answer 1

我不打算将此作为答案，而是让您尝试一些事情。

您在评论中看到 Krishna 的 jsFiddle 了吗？他的例子有什么问题吗？

您可以将类添加到具有 payment_nr 类的所有元素:

$( ".payment_nr" ).addClass( "highred" );

或者您可以将它仅添加到具有类 payment_nr 的输入中:

$( "input.payment_nr" ).addClass( "highred" );

或者您可以将它添加到该特定输入元素的 ID 中:

$( "#email" ).addClass( "highred" );

您是否使用 Chrome 的 F12(开发者工具)查看元素以查看是否添加了该类？

再次:请评论the jsFiddle that Krishna created在第一条评论中。你看到了吗？