javascript里添加按钮button,然后就可以弹出一个对话框输入数据
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript里添加按钮button,然后就可以弹出一个对话框输入数据相关的知识,希望对你有一定的参考价值。
如题,如何做到在javascript里面添加一个按钮,按了之后就弹出对话框,能输入数据。
你自己找一个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>
参考技术A <!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>本回答被提问者采纳
js 动态添加的按钮 onclick事件怎么写?
参考技术A如图,比方说我有一个函数,而我们需要点击按钮触发指定的函数,这就用到了绑定事件的方法。
如图,假定是点击事件,则在按钮里面添加onclick=函数名即可把函数绑定到按钮上。onclick绑定的是单击事件哦,当然还有很多其他的事件。
如图,绑定事件之后,当我们点击按钮即可触发绑定的函数,非常神奇哦。
当然,也可以给按钮设定一个ID,然后我们获取到带有ID的按钮。
然后在JavaScript中绑定事件也是可以的,这种方法代码比较多,想用哪种看你自己哦。
需要特别注意一点的是,如果用了第二种方法,当要获取id时,如果script脚本写在head里面,则要加上window.onload哦。如果是写在body后面,则不需要写window.onload。
以上是关于javascript里添加按钮button,然后就可以弹出一个对话框输入数据的主要内容,如果未能解决你的问题,请参考以下文章