使用jQuery单击输入元素后如何显示或隐藏元素?

时间:2017-03-06 17:02:44

标签: jquery html css

我有这个代码。当我将它与链接或div一起使用时,它运行良好。但是当我想在点击输入后显示或隐藏元素时,它不起作用。这是HTML代码:

<div class="form">
    <div class="row sec">
     <div class="large-3 columns">
     Select a subject
     </div>
     <div class="large-3 columns">
      <div class="radio science_b"><input type="radio" class="science_b" name="subject" value="Science" ><label for="subject"><span class="science_b"></span>Science</label></div>
     </div>
     <div class="large-3 columns">
      <div class="radio"><input type="radio" class="language_b" name="subject" value="Language" ><label for="subject"><span></span>Language</label></div>
     </div>
     <div class="large-3 columns">
      <div class="radio"><input type="radio" class="humanistic_b" name="subject" value="Humanistic" ><label for="subject"><span></span>Humanistic</label></div>
     </div>
    </div>
</div>

<div class="humanistic">
</div>
<div class="humanistic">
</div>
<div class="humanistic">
</div>

这是jQuery

$(document).ready(
    function() {
        $(".science_b").click(function() {
          $(".science").show("slow", "swing");
          $(".humanistic").hide();
          $(".language").hide();
        });
        $(".language_b").click(function() {
          $(".language").hide();
          $(".science").show("slow", "swing");
          $(".humanistic").hide();
        });
        $(".humanistic_b").click(function() {
          $(".humanistic").show("slow", "swing");
          $(".language").hide();
          $(".science").hide();
        });
    });

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

经过一次又一次的尝试并考虑到你的评论后,我意识到我使用的一个插件存在一个问题,使用该表单来设置按钮的样式。我删除它,它的工作原理。感谢。