zoukankan      html  css  js  c++  java
  • JQuery ui 实现类似于confirm的功能

    今天在改进参加一个全国比赛的项目作品时,发现使用了大量的alert和comfirm,于是自己想实现了弹出一个图形化的对话框,这样会变的非常友好,因为时间不多,直接黏贴代码,分享一下

    //当页面加载完毕时添加一个隐藏的div
    $(function(){
       var boardDiv = "<div id='message' style='display:none;'><span id='spanmessage'></span></div>";
       $(document.body).append(boardDiv);
    
    });
    //只是提示信息alert
       function message(text) {
           $("#spanmessage").text(text);
           $("#message").dialog({
               title:"企业信息管理系统,提示您",
               modal: true,
               buttons: {
                   "确定": function() {
                       $(this).dialog("close");
                   }
               }
           });
       }
       //类似于confirm的功能
       //说明callback是如果要选择是,要执行的方法
       function queren(text, callback) {
           $("#spanmessage").text(text);
           $("#message").dialog({
               title: "企业信息管理系统,提示您",
               modal: true,
               resizable: false,
               buttons: {
                   "否": function() {
                       $(this).dialog("close");
                   },
                   "是": function() {
                       callback.call();//方法回调
                       $(this).dialog("close");
                   }
               }
           });
       }
     
    

      使用示例(一个静态删除功能的示例)

    1、先引用JQuery库如(    <script src="http://www.cnblogs.com/js/jquery-1.4.2.js" type="text/javascript"></script>)

    2、在引用JQuery ui库

        <link href="../css/css/ui-lightness/jquery-ui-1.8.2.custom.css" rel="stylesheet"
            type="text/css" />

    <script src="../js/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script>

    3、写处理代码

     $("a[delete=true]").click(function() {
                    var id = $(this).attr("curId");
                    queren("确认要删除吗?", function() {
                        $.post("productDel.ashx", { "action": "delete", "id": id }, function(data, status) {
                            if (data == "ok") {
                                message("删除成功!");
                                $("a[curId='" + id + "']").parent().parent().parent().parent().remove();
                            }
                        });
                    });
                });
    

    看看效果怎么样(还没有做美工)

        

      

  • 相关阅读:
    绘制矩形
    绘制线条
    画直线
    画弧线
    绘制贝塞尔曲线
    我关注的一些博客或资源链接
    vim必记指令
    mac下使用vim gcc/g++ 编译cpp(c++)文件并运行
    机器学习算法中如何选取超参数:学习速率、正则项系数、minibatch size
    正则化方法:L1和L2 regularization、数据集扩增、dropout
  • 原文地址:https://www.cnblogs.com/JerryWang1991/p/2127503.html
Copyright © 2011-2022 走看看