javascript - 单选按钮检查属性未根据用户操作更新

Question

我正在尝试监视广播组的变化。

我正在使用带有以下 HTML 的面漆：

<ul class="topcoat-list">
    <li class="topcoat-list__item">
       <label class="topcoat-radio-button__label">
            <input type="radio" name="topcoat" value="1" checked="checked">
            <div class="topcoat-radio-button"></div>
            Test1
        </label>
    </li>
    <li class="topcoat-list__item">
        <label class="topcoat-radio-button__label">
            <input type="radio" name="topcoat" value="2">
            <div class="topcoat-radio-button"></div>
            Test2
        </label>
    </li>
    <li class="topcoat-list__item">
        <label class="topcoat-radio-button__label">
            <input type="radio" name="topcoat" value="3">
            <div class="topcoat-radio-button"></div>
            Test3
        </label>
    </li>
</ul>

由于我不太明白的原因，checked当用户选择另一个单选按钮时，该属性不会更新......

我希望能够使用 javascript 监控更改，但现在，我无法获取无线电组的值...

$('input[name=topcoat]').change(function(){ changed() });

function changed() {
  id = $('input[name=topcoat]').val();
  alert(id);
}

Answer 1

请尝试这种方式，我希望它能解决您的问题：

<script type="text/javascript">
$(function(){

$('input[name="topcoat"]').change(function(){ changed() });

function changed() {
  id = $('input[name="topcoat"]:checked').val();
  alert(id);
}

});

</script>