javascript实现弹出对话框

czxzz

浏览: 34292 次
性别:
来自: 上海

最近访客更多访客>>

fortunely

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (8)

社区版块

存档分类

JavaScript HTML

版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
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 onclick="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>

分享到：