Question

我想在点击它时在我的单选按钮上应用一个事件......

我尝试使用以下代码：my code

<div id="inline_content">
<form class="type" >
    <header class="ui-header">
        <h2 class="ui-title">Duration</h2>
    </header>
<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>
</form>
</div>

和javascript：

$("#inline_content input[name='type']").click(function(){
alert('You clicked radio!');
// if($('input:radio[name=type]:checked').val() == "walk_in"){
    alert($('input:radio[name=type]:checked').val());
    //$('#select-table > .roomNumber').attr('enabled',false);
//}
});

但它似乎不起作用！

提前致谢。

Answer 1

一些问题：

您没有在小提琴中包含jQuery，因此$未定义。
您没有任何名为input

type

您应该收听change事件而不是click事件，因为输入可以通过其他方式更改，例如使用键盘。

这有效（如果你有jQuery）：

$("#inline_content input[name='radSize']").on('change', function(){
    alert('You clicked radio!');
});

Answer 2

更改选择器，请参阅jquery api

$("#inline_content input:radio").click(function(){
    //do something
});

您的代码：jsfiddle

Answer 3

这是一个免费的jQuery版本：

var input = document.querySelectorAll("input[name='radSize']");
var totalInputs = input.length;
var radioClick = function(){
    console.log(this.value);
}
for ( i = 0; i < totalInputs; i++ ) {
    input[i].addEventListener('change', radioClick, 0);
}

在单选按钮上添加事件

3 个答案: