zoukankan      html  css  js  c++  java
  • 前端小结(2)---- 弹出新页面

    $(function () {
            var elem;
            $("#mytable").on('click', 'td.CommTopic', function (event) {
                elem = $(this).closest('tr');
                var row = table.api(true).row(elem);
                var ruleId = row.data().CusRuleID;
    
                var url = '/CustomerTurn/CommContent?ruleId=' + ruleId;
    
                //隐藏搜索框
                $(".task-item").hide();
                //点击行变色
                elem.css("background-color", "#D7FFDA");
    
                elem.prevAll().hide();
                elem.nextAll().hide();
    
                //点击行切至最后一行
                $(elem).appendTo("#mytable");
    
                $(".dataTables_scrollBody").css("height", "auto");
                $(".widget").css({ "z-index": 9, "left": 2000, "top": -38 })
                            .animate({ "left": 0 }, "slow");
    
                //弹出窗口
                showWin($(".widget"), url);
            });
    
            showWin = function (item, url) {
                //添加并显示遮罩层
                $("<div id='mask'></div>").addClass("mask")
                                .width("100%")
                                .height("100%")
                                .appendTo("body")
                                .fadeIn(200);
                html = '<div class="widget-body detailwin"><div class="close" onclick="hide(event)">X</div><div class="content"></div></div>';
    
                item.after(html).css({ "position": "relative" })
                                .parent().find(".detailwin")
                                .show()
                                .css({ "left": "0", "top": 2000, "margin-right": "1.7%" })
                                .animate({ "top": "45%" }, "slow")
                                .end()
    
                item.parent().find(".content").css({ "overflow-y": "scroll", "height": "640px" })
                if (url != "") {
                    $(".content").load(url);
                }
            };
    
            hide = function (event) {
                //elem.addClass("finger");
                $(".detailwin").remove();
                $(".task-item").show("slow");
                $(".mask").remove();
                $("#mytable tr").show();
                $(".widget").css({ "top": 0, "z-index": 0 });
    
                $("#mytable").DataTable().ajax.reload();
            };
        });
  • 相关阅读:
    hostapd AP模式 2.4G/5G
    hostapd挂载不上驱动bcmdhd.ko以及SDIO读写错误
    C++入门 -- const用法(转载)
    C++ 入门 -- size_t
    C++ 入门 -- 全局变量的使用(转载)
    C++ 入门 -- const用法小结
    大数据揭示的10个常见JAVA编程错误
    jsfiddle
    ionic
    React native android 最常见的10个问题
  • 原文地址:https://www.cnblogs.com/endlessdream/p/4877922.html
Copyright © 2011-2022 走看看