Question

我正在研究一种在jQuery和单选按钮的帮助下显示和隐藏表单的方法。秀和隐藏部分正在运作。在我的表格中有一个问题，我是否会参加聚会。当单击单选按钮时，我可以看到我必须填写的所有个人详细信息字段（名称，地址等...），当我单击否时，所有这些字段都被隐藏。现在，当表单重新加载时，似乎我的jQuery没有保存单选按钮的值，并且将显示个人字段，无论是或否。我可以在代码中更改什么，以便在重新加载表单时，我保持选中的单选按钮选项？

我创建了一个模拟问题的小提琴：https://jsfiddle.net/eo9ydcbn/2/

accepted = $('input[name*="accepted"]');

accepted.change( function() {
    var input_accepted = $('input[name*="accepted"]:checked').val();
    console.log(input_accepted);
    if ( input_accepted  == '0' ) {
        $('#registerForm').collapse('hide');
    }
    else
    {
        $('#registerForm').collapse('show');
    }
}).trigger('change');

非常感谢所有帮助！

Answer 1

这个小提琴会帮助你，你会看到锄头根据收音机做出改变：https://jsfiddle.net/maky/pahrthy0/

$(document).ready(function() {
  $('input[type="radio"]').click(function() {
    if ($(this).attr("value") == "red") {
      $(".box").not(".red").hide();
      $(".red").show();
    }
    if ($(this).attr("value") == "green") {
      $(".box").not(".green").hide();
      $(".green").show();
    }
    if ($(this).attr("value") == "blue") {
      $(".box").not(".blue").hide();
      $(".blue").show();
    }
  });
});

Answer 2

我明白了，

我没有使用.collapse来显示和隐藏表单，而是使用.show和.hide。现在它保持我的单选按钮设置

accepted = $('input[name*="accepted"]');

accepted.change( function() {
    var input_accepted = $('input[name*="accepted"]:checked').val();
    console.log(input_accepted);
    if ( input_accepted  == '0' ) {
        $('#registerForm').hide('slow');
    }
    else
    {
        $('#registerForm').show('slow');
    }
    }).trigger('change');

表单重新加载jQuery时不保存单选按钮值

2 个答案: