Question

当我选择单选按钮时，我想要隐藏一个div，当我取消选中单选按钮时，我想显示该div。如果有人知道，请我想在检查单选按钮时隐藏div。

<input type="radio" id="fix" name="price" checked="checked" value="fix">
<div id="hour">
<input type="text" name="rs"/>
</div>

Answer 1

您可以使用jQuery中的change（）函数，该函数在更改选择器时触发。然后只需将val（）与您的值进行比较，然后采取行动。

$("input[type='radio']").change(function() {
    if ($(this).val() == "fix") {
        // show div
    } else {
        // hide div
    }
});

Answer 2

你有单个单选按钮，你可能想要使用复选框。由于单个单选按钮无法取消选中。

<强> Live Demo

HTML 的

<input type="checkbox" id="fix" name="price" checked="checked" value="fix">

的Javascript

$('#fix').change(function(){
  $('[name=rs]')[0].style.display = this.checked ? 'block' : 'none';
});

Answer 3

当只有一个单选按钮时，我们无法取消选中。

因此，将输入类型更改为checkbox。然后你可以使用这个CSS：

:checked + #hour{
    display: none;
}

<强> Working Fiddle

Answer 4

$("input[type='radio']").change(function() {
    if ($(this).val() == "fix") {
        document.getElementById("hour").style.display = '';
    } else {
        document.getElementById("hour").style.display = 'none';
    }
});

简单的解决方案。

单选按钮选择或取消选择Javascript Jquery

4 个答案: