is_thinking 2015-08-21 00:59 采纳率: 66.7%
浏览 2512
已采纳

JavaScript做了个弹出层的form ,请问如何关闭form

 <div class="form-control" id="sign_in" style="display:none">
        <input type="text" class="form-control" placeholder="Username">
        <input type="text" class="form-control" placeholder="password">
        <input type="button" class="btn btn-primary" value="sign in">
        <input type="button" class="btn btn-success" value="cancle">
 </div>
 <script>
            function signIn() {
                addBg();
                var alert_sign_in = document.getElementById("sign_in");
                alert_sign_in.style.display = "block";
                alert_sign_in.style.position = "absolute";
                alert_sign_in.style.top = "50%";
                alert_sign_in.style.left = "50%";
                alert_sign_in.style.marginTop = "-75px";
                alert_sign_in.style.marginLeft = "-150px";
                alert_sign_in.style.width = "500px";
                alert_sign_in.style.height = "700px";
                alert_sign_in.style.zIndex = "501";

              var mybg = document.createElement("div");
              mybg.setAttribute("id","mybg");
              mybg.style.background = "#000";
              mybg.style.width = "100%";
              mybg.style.height = "100%";
              mybg.style.position = "absolute";
              mybg.style.top = "0";
              mybg.style.left = "0";
              mybg.style.zIndex = "500";
              mybg.style.opacity = "0.3";
              mybg.style.filter = "alpha(opacity=30)";
              document.body.appendChild(mybg);

              document.body.style.overflow = "hidden";
            }
        </script>

这个是一个弹出式的登录功能,先有个遮罩层,然后弹出一个form供用户输入信息,请问这个这个form如何关闭?就是用户取消登录的时候,遮罩层自动取消,然后form自动关闭。

弹出式的登录功能是这样写的吗?有没有其他的写法,谢谢。

  • 写回答

4条回答

  • M.François 博客专家认证 2015-08-21 02:00
    关注

    用JQUERY把form和遮罩层的div隐藏即可,或者移除

    隐藏代码
    $("form的ID").hide();
    $("div的ID").hide();

    移除代码
    $("form的ID").remove();
    $("div的ID").remove();

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

悬赏问题

  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥30 用arduino开发esp32控制ps2手柄一直报错
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题
  • ¥20 求一个html代码,有偿