Question

我有3个标签为＆＃39; Squat＆＃39;＆＃39; Benchpress＆＃39;和＃Deadlift＆＃39;每个显示和隐藏相关的下拉菜单，（我有3个下拉菜单，但每次只显示一个，包含不同的数据）

虽然现在我已经增加了3个无线电按钮，称为“初级＆＃39;”，＆＃39;次要＆＃39;和＆＃39;援助＆＃39;现在，如果主要＆amp;选择辅助radiobutton我不会看到任何下拉，只有当选择了辅助时才会显示。当选择Secondary时，它应该只是一个可见的，因为它现在！我似乎无法让它发挥作用。

我包括这个小提琴，这样你就可以看到我的意思了！

$(function() {
  $("#datepicker").datepicker({ dateFormat: "yy-mm/dd" }).val()
});

//Script for hiding dropdown menus and showing the one connected
//to the right exercise based on which radiobutton is selected.
$(function() {
  $("input[type='radio']").change(function() {
    if ($(this).val() == 1  && this.checked) {
      $("#exerVariNameS").show();
      $("#exerVariNameB").hide();
      $("#exerVariNameD").hide();
    } else if ($(this).val() == 2  && this.checked){
      $("#exerVariNameS").hide();
      $("#exerVariNameB").show();
      $("#exerVariNameD").hide();
    } else if ($(this).val() == 3  && this.checked) {
      $("#exerVariNameS").hide();
      $("#exerVariNameB").hide();
      $("#exerVariNameD").show();
    }
  });
  //Remember which radiobutton was last clicked and keeps it that way
  //after a page refresh or form post.
  $('input[type=radio]').each(function() {
    var state = JSON.parse( localStorage.getItem('radio_'  + this.id) );
    if (state) this.checked = state.checked;
    $(this).trigger('change');
  });        
  $(window).bind('unload', function() {
    $('input[type=radio]').each(function() {
      localStorage.setItem('radio_' + this.id, JSON.stringify({checked: this.checked}));
    });
  });
});

https://jsfiddle.net/o7m0d4uu/4/

请问我是否解释得很糟糕！

Answer 1

您只需要使用click触发name="Type"事件处理程序到单选按钮。

这是解决方案：

$("input[name='Type']").click(function(){
        var value=$(this).val();
        switch(value){
            case '4':
              $("input[name='Exercise']").each(function(){
                $(this).closest('div').hide();
              });
              $('#dropdown').hide();
              break;
            case '5':
              $("input[name='Exercise']").each(function(){
                  $(this).closest('div').show();
              });
              $('#dropdown').show();
              break;
            case '6':
              $("input[name='Exercise']").each(function(){
                $(this).closest('div').hide();
              });
              $('#dropdown').hide();
              break;
        }
});

这是一个有效的solution

Javascript在radiobutton

1 个答案: