jQuery hide / show div,带有单选按钮控件

时间:2013-11-20 11:26:08

标签: javascript jquery html

我有几个同名的单选按钮。

Office <input type="radio" name="owner_type" value="0" />
Agent <input type="radio" name="owner_type" value="1" />

并拥有jQuery代码的一部分,它必须显示或隐藏部分代码。

$('[name="owner_type"]').change(function(){
    if ($('[name="owner_type"]').val() == 1) {
        alert("it's 1 now");
        $('#agents').show();
    } else {
        alert("it's 0 now");
        $('#agents').hide();
    }
});

添加了警报以进行调试。它始终是关于0的警报。无论现在检查哪个无线电。我希望,你可以帮助我。谢谢

4 个答案:

答案 0 :(得分:2)

你可以这样做:

$('[name="owner_type"]').change(function () {
    if ($('[name="owner_type"]:checked').val() === "1") {
        alert("it's 1 now");
        $('#agents').show();
    } else {
        alert("it's 0 now");
        $('#agents').hide();
    }
});

实际上,你这样做:

$('[name="owner_type"]').val()

总是会获取第一个单选按钮的值,无论是否已选中。

为了获得change事件中已检查单选按钮的值,您可以使用上面的:checked选择器。

答案 1 :(得分:0)

var $oTypes = $('input[name="owner_type"]').change(function () {
    //$('#agents').toggle($oTypes.filter(':checked').val() == 1);
    $('#agents').toggle(this.value == 1);
});
  1. 在属性选择器
  2. 之前使用元素选择器
  3. 使用切换设置显示状态

答案 2 :(得分:0)

尝试这样的事情

            $('input[name="owner_type"]').change(function(){
                if (this.value == 1) {
                    alert("it's 1 now");
                    $('#agents').show();
                } else {
                    alert("it's 0 now");
                    $('#agents').hide();
                }
            });

答案 3 :(得分:0)

试试这个,使用:checked选择器

DEMO

$('[name="owner_type"]').change(function(){
    if($('[name="owner_type"]:checked').val() == 1) {
        alert("it's 1 now");
    $('#agents').show();
    } else {
        alert("it's 0 now");
    $('#agents').hide();
    }
});