怎么实现在弹出层登录上点注册切换到注册

怎么实现在弹出层登录上点注册切换到注册

http://img1.sycdn.imooc.com/climg//59c8fd7e0001bfdb16680877.jpg

怎么点注册就切换到注册

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

6回答
提问者 我叫李旦雅 2017-09-27 03:02:16

给后面的人提个醒,我没有把这个放在登录事件中,所以没有奏效。。。

好帮手慕糖 2017-09-26 18:36:57

你好,这只有部分代码,无法解决问题,建议:这个类似与选项卡,点击登录或者注册,对应的页面显示就可以了,这个跟之前的轮播图的选项卡类似哟,如果还是不可以,建议:把这部分的全部代码都粘贴过来,包括html、css与js;或者也可以在提交作业中标明下。

祝学习愉快~

小丸子爱吃菜 2017-09-26 16:24:56

当点击登录或者注册时,弹出层和登录框都显示出来,如下:

$('.link-hover').click(function(){

$(".modal").css('display','block');

$(".maskLayer").css('display','block');

})


  • 提问者 我叫李旦雅 #1
    实现不了 也不报错 这是我的弹出层js 代码 //登陆事件 $('#loginLink').click(function(){ //获取登陆窗体代码 var loginHtml=$('.loginHtml').html(); showLayer(loginHtml,365,365,closeCallBack); //表单验证 $('#loginSubmitBtn').click(function(){ var username=$('#username').val(); var password=$('#password').val(); //正则表达式验证 搜的 if(!username.match(/^(((13[0-9]{1})|159|153)+\d{8})$/)&&!username.match(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/)){ $('.error-msg').html("请输入正确的邮箱或手机号"); }else{ $('.error-msg').html("OK"); } if(password==""){ $('.error-msg2').html("请输入6-16位密码,区分大小写,不能使用空格!"); }else{ alert("登陆成功"); } }) }) //注册事件 $('#reLink').click(function(){ var reHtml=$('.reHtml').html(); showLayer(reHtml,365,320,closeCallBack); //表单验证 $('#loginSubmitBtn').click(function(){ var username=$('#username').val(); var password=$('#password').val(); if(!username.match(/^(((13[0-9]{1})|159|153)+\d{8})$/)&&!username.match(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/)){ $('.error-msg').html("请输入正确的邮箱或手机号"); }else{ $('.error-msg').html("OK"); } if(password=="gyyd"){ alert("登陆成功"); }else{ $('.error-msg2').html("请输入正确的验证码"); } }) }) 能根据这个写下吗
    2017-09-26 17:03:48
  • 小丸子爱吃菜 回复 提问者 我叫李旦雅 #2
    因为代码比较多,涉及到页面和样式,无法帮你调,如果这个是作业的话,建议你可以先提交作业,因为作业可以打包代码,将你的问题写在作业中,老师可以根据你的代码以及问题给出意见和建议!
    2017-09-26 18:17:59
一路电光带火花 2017-09-26 13:52:08

JS的轮播图作业和JQ的轮播图作业你写过吧?这个思路跟导航切换图片的思路是一样的呀,按照那个写就行。

  • 提问者 我叫李旦雅 #1
    不一样把 关键是多了个弹出层
    2017-09-26 13:55:33
  • 它是在弹出层上面的,跟这个没关系吧,你试试呗,给你看看我的代码: // 登录注册切换 $('.modal-header a').click(function(){ var index = $('.modal-header a').index($(this)); $(".sign .tab-panel").eq(index).addClass("tab-panel-active").siblings().removeClass("tab-panel-active"); })
    2017-09-26 16:00:41
  • 获取到当前的下标,然后为当前的下标添加当前的样式,然后当前下标的兄弟元素去掉这些样式。希望对你有帮助吧
    2017-09-26 16:01:41
提问者 我叫李旦雅 2017-09-26 13:05:20

知道可以这样 ,可是实现不了 先调出两个弹出层吗 不调也没有效果 调了也没有效果 能给个示范代码吗

小丸子爱吃菜 2017-09-26 11:31:31

点注册时将登录的内容隐藏显示注册的内容,可以使用display属性进行切换!

祝学习愉快!

  • 提问者 我叫李旦雅 #1
    知道可以这样 ,可是实现不了 先调出两个弹出层吗 不调也没有效果 调了也没有效果 能给个示范代码吗
    2017-09-26 13:05:40
  • 提问者 我叫李旦雅 #2
    就剩这个了
    2017-09-26 15:53:16
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师