Jquery UI 封装 Alert框

最新推荐文章于 2022-11-24 08:08:30 发布

iteye_2179

最新推荐文章于 2022-11-24 08:08:30 发布

阅读量424

点赞数

分类专栏： JQuery 文章标签： ui javascript ViewUI

本文链接：https://blog.csdn.net/iteye_2179/article/details/82168565

版权

JQuery 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

<!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 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>

</body>
</html>