以下我写的 jq不对。还望大神帮我纠正下添加我想要的效果。
$("#J_phone").click(function(){ //这是按钮块
$(".forget_main").find(".forget_main").hide().next().removeClass("hidden");
$(".icon-forget").addClass("icon-forge-2");
})
我想在单击按钮的时候把手机步骤(1)隐藏,然后手机步骤 (2) show就出来。
再单击下一步的按钮 第二步的hide().第三步就slow()。
<!--手机步骤(1)-->
<div class="forget_main">
<div class="form_1">
<div class="qipao">
<div class="tag">
<div class="arrow">
<em>◆</em><span>◆</span>
</div>
<span>请输入您的登录名</span>
</div>
</div>
</div>
<div class="form_2">
<div class="qipao">
<div class="tag">
<div class="arrow">
<em>◆</em><span>◆</span>
</div>
<span>请输入正确的登陆名</span>
</div>
</div>
</div>
<div class="logo_name">
<span class="f14">登陆名: </span>
<input type="text" placeholder="请输入手机号/邮箱/微信" id="pass" onclick="pass()">
</div>
<div class="logo_code">
<span class="f14">验证码:</span>
<input type="text">
<a href="">
<img src="res/img/code_03.jpg" alt="">
<span class="f14">换一张</span>
</a>
<div class="weichat_code">
<div class="wecode">微信二维码</div>
<div class="wecode1"><img src="res/img/images/weichat2_03.jpg" alt=""></div>
<div class="wecode2">扫二维码找回</div>
</div>
<div class="form-back">
<button class="phone_b" id="J_phone">手机找回</button>
<button class="email_b">邮箱找回</button>
</div>
</div>
</div>
<!--手机步骤(2)-->
<div class="forget_main p79 hidden">
<div class="sms"> 短信已发送!</div>
<p class="text_1">今日开抢网已向您的手机 <span>186*****383 </span> 发送了验证码短信,请您及时查看。</p>
<div class="text_2">
<span> 短信验证码 :</span>
<input type="text" placeholder="请输入短信验证码">
<button>获取验证码</button>
</div>
<div class="ht col-lg-offset-4">
<button class="confirm">确定</button>
</div>
</div>
<!--邮箱步骤(2)-->
<div class="forget_main p79 hidden">
<div class="sms"> 邮件已发送!</div>
<p class="text_1">验证邮件已发送至您的邮箱 <span>12*****87@qq.com,</span> 请点击邮件中的链接重置您的密码。
请在24小时内通过邮件中的链接重设密码。</p>
<div class="ht col-lg-offset-4">
<button class="confirm">去邮箱查看</button>
<button class="resending">去邮箱查看</button>
</div>
</div>
<!--微信(2)-->
<div class="forget_main p79 hidden">
<div class="msm_send">信息已发送!
</div>
<div class="msm_send f12"> 您的账号资料已发送至您的微信,请勿泄漏给他人,请牢记!</div>
<div class="ht lf">
<button class="confirm">抢购去</button>
</div>
</div>
<!--设置新密码(3)-->
<div class="forget_main hidden">
<div class="new_pss">
<span class="w84"> 新密码:</span>
<input type="text" placeholder="由8-20位字母,数字和符号组合">
</div>
<div class="safe_level">
<span class="w84"> 安全级别: </span>
<i class="safe_level_l "></i> <!--弱-->
<i class="safe_level_l2 "></i> <!--中-->
<i class="safe_level_l3"></i><!--强-->
</div>
<div class="new_pss">
<span class="w84"> 确认密码:</span>
<input type="text" placeholder="请再次输入上面的密码">
</div>
<div class="ht col-lg-offset-4">
<button class="confirm">确定</button>
</div>
</div>
<!--成功(4)-->
<div class="forget_main hidden">
<p class="congratulate">
恭喜您,您的新密码已设置成功,请您牢记!为了保证您的购物安全,<br>
请不要轻易泄露给他人,建议您定期更改密码以保护账户安全。
</p>
<div class="ht col-lg-offset-4">
<button class="confirm">确定</button>
</div>
</div>
试试这个可不可以