在单选按钮上关联事件侦听器

Associate an event listener on a radio button

本文关键字：事件 侦听器 关联 单选按钮      更新时间：2023-09-26

我有这样的代码:

 <div class="ui-content">
        <ul class="ui-listview">
            <li class="li-has-radio">
                <label>
                    15 mn
                    <input type="radio" value="15" name="radSize" checked="checked"/>
                </label>
            </li>
            <li class="li-has-radio">
                <label>
                    30 mn
                    <input type="radio" value="30" name="radSize"/>
                </label>
            </li>
            <li class="li-has-radio">
                <label>
                    45 mn
                    <input type="radio" value="45" name="radSize"/>
                </label>
            </li>
        </ul>
    </div>

当我有一个事件监听器时像这样点击每个按钮:

$("#inline_content input[name='radSize']").on('change', function(){
alert('You clicked radio!');
    var mytime = $('input:radio[name=radSize]:checked').val();
    alert($('input:radio[name=radSize]:checked').val());
    window.open("categorie.html?temps="+mytime);
});

一切都很好，除了第一个单选按钮，它是默认选中的，但当我点击它时，什么也没有发生。

我该怎么办?谢谢。

问题是选中的单选按钮在你点击它时不会改变。我建议要么切换到click处理程序(而不是更改)，要么使用按钮而不是无线电。

当然，对于按钮，您还需要一个click处理程序。

如果你想让事情更像你现在所拥有的，从第一个未选中的单选开始也会解决这个问题。

使用click事件:

$("input[name='radSize']").on('click', function(){
alert('You clicked radio!');
    var mytime = $('input:radio[name=radSize]:checked').val();
    alert($('input:radio[name=radSize]:checked').val());
});
http://jsfiddle.net/p3C8L/

相关文章：