单选按钮上的 jQuery 单击事件不会被触发

jQuery click event on radio button doesn't get fired

提问by Imesh Chandrasiri

I've got the following code to trigger a click event on some radio buttons! but it doesn't get fired! can any one help me with this!

我有以下代码来触发一些单选按钮上的点击事件！但它不会被解雇！谁能帮我这个！

CODE :

代码 ：

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

RADIO BUTTONS

单选按钮

<form class="type">
<input type="radio" name="type" checked="checked" value="guest">In House</input>
<input type="radio" name="type" value="walk_in">Walk In</input>
</form>.

Update

更新

Tried onChange()too but not working.

也尝试onChange()过，但没有奏效。

回答by yeyene

It fires. Check demo http://jsfiddle.net/yeyene/kbAk3/

它着火了。检查演示http://jsfiddle.net/yeyene/kbAk3/

$("#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);
    }
});

回答by Broxzier

There are a couple of things wrong in this code:

这段代码有几处错误：

1. You're using <input>the wrong way. You should use a <label>if you want to make the text behind it clickable.
2. It's setting the enabledattribute, which does not exist. Use disabledinstead.
3. If it would be an attribute, it's value should not be false, use disabled="disabled"or simply disabledwithout a value.
4. If checking for someone clicking on a form event that will CHANGE it's value (like check-boxes and radio-buttons), use .change()instead.

1. 你用<input>错了方法。<label>如果您想让其后面的文本可点击，您应该使用 a 。
2. 它正在设置enabled不存在的属性。使用disabled来代替。
3. 如果它是一个属性，它的值不应该是false、使用disabled="disabled"或根本disabled没有值。
4. 如果检查某人单击将更改其值的表单事件（如复选框和单选按钮），请.change()改用。

I'm not sure what your code is supposed to do. My guess is that you want to disable the input field with class roomNumberonce someone selects "Walk in" (and possibly re-enable when deselected). If so, try this code:

我不确定你的代码应该做什么。我的猜测是，roomNumber一旦有人选择“Walk in”（并可能在取消选择时重新启用），您就想用 class 禁用输入字段。如果是这样，请尝试以下代码：

HTML:

HTML：

<form class="type">
    <p>
        <input type="radio" name="type" checked="checked" id="guest" value="guest" />
        <label for="guest">In House</label>
    </p>
    <p>
        <input type="radio" name="type" id="walk_in" value="walk_in" />
        <label for="walk_in">Walk in</label>
    </p>
    <p>
        <input type="text" name="roomnumber" class="roomNumber" value="12345" />
    </p>
</form>

Javascript:

Javascript：

$("form input:radio").change(function () {
    if ($(this).val() == "walk_in") {
        // Disable your roomnumber element here
        $('.roomNumber').attr('disabled', 'disabled');
    } else {
        // Re-enable here I guess
        $('.roomNumber').removeAttr('disabled');
    }
});

I created a fiddle here: http://jsfiddle.net/k28xd/1/

我在这里创建了一个小提琴：http: //jsfiddle.net/k28xd/1/

回答by Marcus Hoelscher

Personally, for me, the best solution for a similar issue was:

就我个人而言，类似问题的最佳解决方案是：

HTML

HTML

<input type="radio" name="selectAll" value="true" />
<input type="radio" name="selectAll" value="false" />

JQuery

查询

var $selectAll = $( "input:radio[name=selectAll]" );
    $selectAll.on( "change", function() {
         console.log( "selectAll: " + $(this).val() );
         // or
         alert( "selectAll: " + $(this).val() );
    });

*The event "click" can work in place of "change" as well.

*事件“click”也可以代替“change”。

Hope this helps!

希望这可以帮助！

回答by Atif Mohammed Ameenuddin

A different way

一种不同的方式

$("#inline_content input[name='type']").change(function () {
    if ($(this).val() == "walk_in" && $(this).is(":checked")) {
        $('#select-table > .roomNumber').attr('enabled', false);
    }
});

Demo - http://jsfiddle.net/cB6xV/

演示 - http://jsfiddle.net/cB6xV/

回答by Christoph Paster

Seems like you're #inline_contentisn't there! Remove the jQuery-Selector or check the parent elements, maybe you have a typo or forgot to add the id.

好像你#inline_content不在！删除 jQuery-Selector 或检查父元素，可能是您输入错误或忘记添加 id。

(made you a jsfiddle, works after adding a parent <div id="inline_content">: http://jsfiddle.net/J5HdN/)

（让你成为一个 jsfiddle，在添加父级后工作<div id="inline_content">：http: //jsfiddle.net/J5HdN/）

回答by Jya

put ur js code under the form html or use $(document).ready(function(){}) and try this.

将你的 js 代码放在表单 html 下或使用 $(document).ready(function(){}) 并尝试这个。

$('#inline_content input[type="radio"]').click(function(){
                if($(this).val() == "walk_in"){
                    alert('ok');
                }
});