javascript - 我如何使用 jQuery/JavaScript 来查明单选按钮何时被取消选中?

标签 javascript jquery html checkbox radio-button

<分区>

我正在尝试使用 jquery 函数在选中复选框时隐藏/显示某些表单元素。选中单选按钮时,还应该使用相同的功能来隐藏/显示表单元素。问题出在单选按钮上。我的函数无法判断何时取消选中单选按钮,因此现在可以隐藏选中时可见的 div,因为它未选中。我已经显示了下面的代码:

<!-- html on one of the pages -->
<fieldset>
  <label for="viaMail">Send offers to my mail</label>
  <input type="checkbox" id="viaMail" class="slide" autocomplete="off">

  <label for="viaEmail">Send offers to my email address</label>
  <input type="checkbox" id="viaEmail" autocomplete="off">

</fieldset>

<div class="viaMail">  <!-- div hidden with css using display: none rule -->
   <!-- input fields for mailing addresses etc --> 
</div>
<!-- end page one html -->

<!-- html on page two -->   
<fieldset>
  <label for="viaMail">Send offers to my mail</label>
  <input type="radio" name="group1" id="viaMail" class="slide" autocomplete="off">

  <label for="viaEmail">Send offers to my email address</label>
  <input type="radio" name="group1" id="viaEmail" autocomplete="off">

</fieldset>

<div class="viaMail">  <!-- div hidden with css using display: none rule -->
   <!-- input fields for mailing addresses etc -->
</div>

/* the js function */

ShowHideDiv={
init:function(){
    var radcheck = $(".slide");

//if the input element has the class 'slide' then the value of it's 'id' attribute 
//is retrieved and the class which has the same name as the 'id' of the current input
//element is hidden or slided into view - in this case the 'viaMail' class

    radcheck.on("change",function(){
        if($(this).prop('checked')== true) {
            $('body').find("."+$(this).attr('id')).slideDown('slow');
        }
        else {
            $('body').find("."+$(this).attr('id')).slideUp('fast');
        }
    });

}
  }

我已经尝试了复选框的功能,它工作正常。 It doesn't work for the radio buttons - the div is 'slided down' into view but it doesn't disappear by 'slideUp' when the other radio button is selected.非常感谢您的帮助。

最佳答案

应该是这样的

if( $(this).prop('checked', true) )

关于javascript - 我如何使用 jQuery/JavaScript 来查明单选按钮何时被取消选中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21697764/

相关文章:

javascript - 物化CSS : How to enable different checkboxes with JQuery in multiple select?

javascript动态设置对象属性的值

javascript - 在 Laravel 中安装后如何需要 npm 包?

html - 为什么我的链接在 Firefox 中不起作用

html - 我该如何修复这种对齐方式?

javascript - Chrome 的控制台自动完成

javascript - PHP 和 MySQL : Update not working with Foreach Loop

javascript - ios风格的文件夹动画

jquery - 单击关闭嵌套的 div ul li

javascript - 如何在成功的 ajax 请求后禁用 onclick 事件?