javascript里添加按钮button,然后就可以弹出一个对话框输入数据
你自己找一个jQuery的包导进去 不明白再说
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="bin/jquery-1.8.3.js"></script>
<title>无标题文档</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<div id='button' style='margin:40px auto 0 auto;height:30px;width:180px;background:#09C;color:#FFF;font-size:18px;text-align:center;line-height:30px;border-radius: 6px;'>注册</div>
<script>
$(document).ready(function(){
var time=0;
$("#button").click(function(){
showWindow();
center("register");
$("#close").click(function(){
removeWindow();
});
});
function showWindow(){
var htm="<div id='register' style='position:fixed; height:200px; width:400px; background:#CCC;'><em id='close' style='font-size:30px; float:right; margin-right:20px;'>×</em><h3 style='color:#FFF; text-align:center;'>注册框实例</h3><p style='text-align:center;'><input type='text' id='username' placeholder='用户名' /></p><p style='text-align:center;'><input type='password' id='userpass' placeholder='密码' /><em id='strength'></em></p><p style='margin:40px auto 0 auto;height:30px;width:180px;background:#09C;color:#FFF;font-size:18px;text-align:center;line-height:30px;border-radius: 6px;'>注册</p></div>";
if(time==0){
$("body").append(htm);
time=1;
}
return false;
}
function removeWindow(){
$("#register").fadeOut(function(){
$("#register").remove();
});
return false;
}
function center(id){
var h=$(window).height();
var w=$(window).width();
var fh=$("#"+id).height();
var fw=$("#"+id).width();
$("#"+id).css({
"top":(h-fh)/2,
"left":(w-fw)/2
});
}
$(window).resize(function(){
center("register");
});
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
RunJS 演示代码
</title>
<script>
var ck = function(){
var x = prompt ("输入数据: ", "");
alert(x);
}
</script>
</head>
<body>
<button onclick="ck();">
click
</button>
</body>
</html>
广告 您可能关注的内容 |