最近在学习jquery ，今天用jquery ui实现了一个登录用的对话框，现在把代码贴在这里以便以后查看
<html>
<head>
<link rel="stylesheet" type="text/css" href="../themes/flora/flora.all.css" />
<script src="../jquery-1.2.6.js" type="text/javascript"></script>
<script src="../ui/ui.core.js" type="text/javascript"></script>
<script src="../ui/ui.draggable.js" type="text/javascript"></script>
<script src="../ui/ui.resizable.js" type="text/javascript"></script>
<script src="../ui/ui.dialog.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$('#bttn1').click(function() {
//$('#dialogTest').dialog('open');
createLoginDialog();
});
});
function createLoginDialog(){
var obj = $("<div></div>").attr("title","create one dialog!").attr("id","dialogTest");
var username = $("<lable></lable>").text("Username:");
obj = obj.append(username);
var userinput = $("<input type='text' name='username'>");
obj = obj.append(userinput);
var br = $("<br>");
obj.append(br);
var password = $("<lable></lable>").text("Password:");
obj = obj.append(password);
var passinput = $("<input type='password' name='password'>");
obj = obj.append(passinput);
obj.addClass('flora').dialog({
width:350,
height:150,
resizable:'disable',
buttons:{
'OK':function(){
var tmpDialog = $("<div/>")
tmpDialog.html("your username is :"+$(this).find("[name='username']").val())
.html(tmpDialog.html()+"<br> your password is : "+$(this).find("[name='password']").val())
.addClass('flora').dialog({
title:'your input value',
resizable:'disable'
});
},
'Cancel':function(){
$(this).dialog('close');
}
},
title:'My Dialog',
});
}
</script>
</head>
<body>
<button id="bttn1" value="Open the Dialog">Open the Dialog</button>
</body>
</html>这个只是个简单的输入框，在用户输入后，点击ok按钮就会弹出另外一个对话框把用户输入的内容显示出来。
2127
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
