javascript实现弹出对话框

最新推荐文章于 2024-04-20 14:57:38 发布

iteye_12767

最新推荐文章于 2024-04-20 14:57:38 发布

阅读量478

点赞数

文章标签： JavaScript HTML ViewUI

本文链接：https://blog.csdn.net/iteye_12767/article/details/81684777

版权

版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://xiezezhun.blogbus.com/logs/35451680.html

简单对话框

一般常用的是 alert prompt confirm三种对话框

<html>
<head>
<title>Example 简单对话框</title>
</head>
<body>
<script type="text/JavaScript">
<!--
alert("Good Morning!"); 
//alert只接受一个参数，这个参数是一个字符串，alert所做的全部事情是将这个字符串
//原封不动地以一个提示框返回给用户，我们在前面已经多次见到了这种用法
alert("Hello, "+ prompt("What’s your name?")+ "!");
//prompt是一个询问框，它产生一个询问输入窗口，同时等待用户输入的结果
//以继续执行下面的程序，当用户输入完成，点击确认后，它会将输入的字符串返回
//如果用户点了取消按钮，那么它会返回null
if(confirm("Are you ok?"))
//confirm是一个确认框，它产生一个Yes|No的确认提示框，如果回答了Yes，它返回true
//如果回答了No，它返回false
alert("Greate! ");
else
alert("Oh, what’s wrong?");
-->
</script>
</body>

也可以自己定义新窗口模拟对话框

<html>
<head>
<title>Example模拟对话框</title>
</head>
<body>
<button οnclick="opennew()">打开</button>
<script type="text/JavaScript">
<!--
function opennew(){
//doucment.createElement可以用来构造新的DOM对象
var w=document.createElement("div");

//下面一组style属性控制了模拟窗口的样式
//DOM提供的style属性可以很方便地让JavaScript控制元素的展现方式

w.style.top=50;
w.style.left=50;
w.style.height=100;
w.style.width=300;
w.style.position="absolute";
w.style.background="#00ffff";
w.style.paddingTop = 10;

//通过appendChild()方法将创建的div元素对象添加到body的内容中去
w.innerHTML+=("<center>I&nbsp;D&nbsp;:<input><br>密码:<input><br></center>");
document.body.appendChild(w);
}
-->
</script>
</body>
</html>

iteye_12767

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript实现弹出对话框

版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明 http://xiezezhun.blogbus.com/logs/35451680.html 简单对话框一般常用的是 alert prompt confirm三种对话框&lt;html&gt;&lt;head&gt;&lt;title&gt;Example 简单对话框&lt;/title&gt;&lt;/head&gt...
复制链接

扫一扫