将 class 添加到 Checked = True 输入

Question

所以我有一个产品的下拉选择。我只想在检查输入时添加一个 class 。我知道使用 css 你可以识别 input:checked 但我需要额外的进一步开发。这是我的代码的一部分

for (var i=0,length=variant.options.length; i<length; i++) {
    var radioButton = $productForm.find('.swatch[data-option-index="' + escape(i) + '"] :radio[value="' + variant.options[i].replace(/\"/g,'\"') +'"]');
    if (radioButton.length) {
      radioButton.get(0).checked = true;
    }
  }

我尝试以这种方式添加 class：

if (radioButton.length) {
      radioButton.get(0).checked = true.addClass("selected");;
}

然后这样

if (radioButton.length) {
      radioButton.get(0).checked = true;
      radioButton.get(0).addClass("selected");
}

这两种方式都行不通，我不明白为什么。

Answer 1

当您混合使用 javascript 和 jquery 时，它们不起作用 - 是的 jquery 是 javascript，但它有自己的方法适用于 jquery 个对象，其中之一是 .addClass().

所以这段代码：

var radioButton = $productForm.find(...

returns 一个 jquery 对象，同时：

radioButton.get(0)

给出原始的 DOM 对象，它没有 .addClass() 方法。

您可以在不使用 .get(0) 的情况下使用 .addClass，如：

radioButton.addClass("selected");

将 class 添加到 Checked = True 输入

Add class to Checked = True Input

jquery

select

input

shopify

checked