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

我有这段代码。当我使用它与链接或div时，它运作良好。但是当我想在点击一个输入后显示或隐藏一个元素时，它就不起作用。这是HTML代码：如何使用jQuery单击输入元素后显示或隐藏元素？

<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(); 
     }); 
    });

感谢您的帮助。

来源

2017-03-06 Alvaro López Sánchez

对于单选按钮或复选框，使用'.focus' https://api.jquery.com/focus/输入文本或'.change'并选择 – Roljhon

这是你正在尝试做什么？ http://codepen.io/anon/pen/BWLmPR –

经过一次又一次的尝试，并考虑到您的意见后，我意识到有一个插件的问题，我用这个插件来设计按钮风格。我删除它，它的工作。谢谢。 –

经过一次又一次的尝试，并考虑到您的意见，我意识到有一个插件，我正在使用的形式来按钮风格化的问题。我删除它，它的工作。谢谢。

来源

2017-03-06 17:27:16

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

回答

相关问题