Question

我有一系列自定义单选按钮，我正在尝试查看它是否正在为控制台选择正确的值。但我并不是100％肯定如何使用:checked

来捕获它

这是我到目前为止所做的：

<div class="item">
  <input type="radio" id="advisor-908" name="product_advisor" data-advisor="Jim Bob" data-toggle="advisor">
  <label for="advisor-908"><span class="radial"></span>
    <div class="name">Jim Bob
    </div>
  </label>
</div>

<div class="item">
  <input type="radio" id="advisor-909" name="product_advisor" data-advisor="Sneaky Pete" data-toggle="advisor">
  <label for="advisor-909"><span class="radial"></span>
    <div class="name">Sneaky Pete
    </div>
  </label>
</div>

jQuery的：

 $('input[name="product_advisor"]').on('click', function (e) {
    var advisorType = $(this).data("advisor");
    console.log(advisorType);
    e.target

});

最后，我要将该数据属性存储到localStorage中，但现在我只是检查一下我是否可以获取该数据值。

Answer 1

如果您需要从其他地方获取当前选中的单选按钮（与您发布的事件无关）：

$('input[name=product_advisor]:checked').data('advisor')

但为什么不使用输入的value而不是自定义数据属性？

Answer 2

我将更改事件检查与.is()

一起使用

$('input[name="product_advisor"]').change(function(){
    if ($(this).is(":checked")){
         var advisorType = $(this).data("advisor");
         console.log(advisorType);
    }
});

编辑：更改事件可让您捕获不受点击影响的更改。

Answer 3

您在脚本js上提交了错误

替换它：

$('input[name="advisor"]').on('click', function (e) {
var advisorType = $(this).data("advisor");
console.log("advisorType");
e.target
});

使用：

$('input[name="product_advisor"]').on('click', function (e) {
var advisorType = $(this).data("advisor");
console.log(advisorType);
e.target
});

引用数据（顾问）并命名为“product_advisor”。

检查是否选择了自定义单选按钮

3 个答案: