<!DOCTYPE html>
<html lang="en">
<head>
?<meta charset="gbk">
?<title>jQuery UI Dialog - Modal confirmation</title>
?<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
?<script src="../../jquery-1.6.2.js"></script>
?<script src="../../external/jquery.bgiframe-2.1.2.js"></script>
?<script src="../../ui/jquery.ui.core.js"></script>
?<script src="../../ui/jquery.ui.widget.js"></script>
?<script src="../../ui/jquery.ui.mouse.js"></script>
?<script src="../../ui/jquery.ui.button.js"></script>
?<script src="../../ui/jquery.ui.draggable.js"></script>
?<script src="../../ui/jquery.ui.position.js"></script>
?<script src="../../ui/jquery.ui.dialog.js"></script>
?<link rel="stylesheet" href="../demos.css">
?<script>
?$(function() {
??// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
??$( "#dialog:ui-dialog" ).dialog( "destroy" );
?
??$( "#dialog-confirm" ).dialog({
???resizable: false,
???height:140,
???modal: true,
???buttons: {
????"确定": function() {
????????????????????????????????? alert("ok");
?????$( this ).dialog( "close" );
????},
????'取消': function() {
????????????????????????????????? alert("cancel");
?????$( this ).dialog( "close" );
????}
???}
??});
?});
?</script>
</head>
<body>
<div class="demo">
<div id="dialog-confirm" title="Empty the recycle bin?">
?<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>
?
?
</div><!-- End demo -->
?
</body>
</html>