首页 > 编程知识 正文

js点击弹窗弹出表单框代码,js中弹框

时间:2024-04-24 11:43:24 阅读:334233 作者:SGET

本文目录一览:

如何用JS实现10秒以后自动弹出表单窗口。

表单的位置大小需要你用CSS设计。以下代码只是实现了你要的弹出功能。

!DOCTYPE html

html

 head

  titleHTML模板/title

  meta charset="UTF-8"/

  style type="text/css"

   form{

    position:absolute;

    left:100px;

    top:50px;

    width:400px;

    height:300px;

    border:1px solid #aaaaaa

   }

  /style

  script

   var t;

   function closeForm(){

    var form=document.getElementById("form");

    form.style.display="none";

   }

   function showForm(){

    var form=document.getElementById("form");

    form.style.display="block";

    window.clearTimeout(t);

   }

   function timer(){

    t=window.setTimeout(showForm,10000);

   }

  /script

 /head

 body onload="timer()"

  form id="form" style="display:none;"

   input type="text"/

   input type="button" value="关闭" onclick="closeForm()"/

  /form

 /body

/html

点击按钮弹出对话框代码

实现的方法和详细的操作步骤如下:

1、第一步,打开html编辑器,创建一个新的html文件,例如:index.html,然后输入代码,见下图。

2、第二步,完成上述步骤后,在index.html的body标记中,输入js代码,见下图。

3、第三步,完成上述步骤后,浏览器运行index.html页面。 这时,单击按钮将弹出一个提示框,见下图。这样,以上的问题就解决了。

怎么用js弹出提示框

弹出提示框一般有3种

1)alert (普通提示框)

2)prompt (可输入的提示框)

3)confirm (可选择的提示框)

下面举个例子:

!doctype html

html lang="en"

head

    meta charset="UTF-8"

    titleDocument/title

/head

body

button onclick="mal()"第一种:alert/button

button onclick="mpro()"第二种:prompt/button

button onclick="mcon()"第三种:confirm/button

script

    function mal(){

        alert('这是一个普通的提示框');

    }

    function mpro(){

        var val = prompt('这是一个可输入的提示框','这个参数为输入框默认值,可以不填哦');

        //prompt会把输入框的值返回给你

    }

    function mcon(){

        var boo = confirm('这是一个可选择的提示框,3种提示方式,学会了吗?')

        //confirm 会返回你选择的选项,然后可以依据选择执行逻辑

        if(boo){

            alert('学会了,真聪明');

        }else{

            alert('再来一遍吧')

        }

    }

/script

/body

/html

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。