javascript - 基于输入值的带有前缀名称的jQuery addClass

Question

我可以通过执行以下操作将类添加到表单元素：

$("input").each(function() {
  $(this).addClass($(this).attr("name"));
});

本质上，它获取表单值并将其作为类添加到元素中。在大多数情况下可能没问题，但有时值会是数字。所以这给我留下了这样的东西：

<input type="radio" id="amount-5" name="submitted" value="50" class="form-radio 50">

我想，我可以使用 CSS 作为目标，.form-radio.50但在附加值类前面添加一些文本可能会更好。理想情况下

<input type="radio" id="amount-5" name="submitted" value="50" class="form-radio radio-50">

我试过了：

$("input").each(function() {
  $(this).addClass($('radio-class-' + this).attr("value"));
});

......那没有用。我没主意了。这是我的小提琴。

Answer 1

这实际上非常接近，但是您可以像这样简单地使用字符串：

$("input").each(function() {
  $(this).addClass('radio-class-' + $(this).attr("value"));
});

或者

$("input").each(function() {
  $(this).addClass($(this).attr("type") + '-' + $(this).attr("value"));
});

所以你也可以通过input type:)

只是简单解释一下为什么您所做的不起作用：

$(this).addClass( $('radio-class-' + this).attr("value") );

$() 是一个选择器（在大多数情况下），所以你基本上是在选择一个radio-class-[this]不存在的类型元素。另外，this是当前对象的引用，我相信不能通过写入转换为字符串'radio-class-'+this。希望这对你有意义。只需选择对象：$(this)变成this一个，以便jQuery object您可以访问 jQuery 函数，例如.attr()它将返回一个值以用作字符串