Jquery 如何在单击单选按钮时隐藏和显示段落

我试图隐藏和显示有关单选按钮点击段落。我还希望当用户登陆页面时，第一个单选按钮处于活动状态

这是我的HTML：

<div class="BusinessForm">
  <p class="showBusinessForm" style="display:none">Business</p>
</div>
<div class="TechnicalForm">
  <p class="showTechnicalForm" style="display:none">Technical</p>
</div>
<div class="LoginForm">
  <p class="showLoginForm" style="display:none">login</p>
</div>

---

我建议您使用动态方法，而不是针对每个div的特定方法

您可以使用表单的值和类来选择要与无线btn一起显示的目标表单

$（“.radiobtn”）。单击（函数（）{
$（“.form”）.hide（）；
$（“+$（this.val（））.show（）；
})

.form{
显示：无；
}

生意
技术的
登录
生意

技术的

登录

我不想太多地修改您的脚本。下面是基于您的脚本的工作示例

$（文档）.ready（函数（）{
$（“输入：收音机”）.change（函数（）{
if（$（“#业务”）.prop（'checked'）==true）{
$（“.BusinessForm”）.show（）；
$（“.TechnicalForm”）.hide（）；
$（“.LoginForm”）.hide（）；
}else if（$（“#technical”）.prop（'checked'）==true）{
$（“.BusinessForm”）.hide（）；
$（“.TechnicalForm”）.show（）；
$（“.LoginForm”）.hide（）；
}else if（$（“#login”）.prop（'checked'）==true）{
$（“.BusinessForm”）.hide（）；
$（“.TechnicalForm”）.hide（）；
$（“.LoginForm”）.show（）；
}
});
});

商业电台
商业电台
商业电台
业务
技术
登录

您是否面临任何问题？我认为您将单选按钮与段落标记skinly use混淆，以便我们能够完全理解问题。@M.Nabeel当他可以使用StackOverflow已经提供的集成代码段工具时，为什么还要使用JSFIDLE？您是否也可以添加单选按钮的html部分
$(document).ready(function() {
    $(".showBusinessForm").show();
});
$(".showBusinessForm").click(function(){
    $(".showTechnicalForm").hide();
    $(".showLoginForm").hide();
    $(".showBusinessForm").show();
});
$(".showTechnicalForm").click(function(){
    $(".showTechnicalForm").show();
    $(".showLoginForm").hide();
    $(".showBusinessForm").hide();
});
$(".showLoginForm").click(function(){
    $(".showTechnicalForm").hide();
    $(".showLoginForm").show();
    $(".showBusinessForm").hide();
});