将所有图标更改为一个

时间:2016-08-18 17:55:16

标签: javascript jquery css typescript

我目前有一个巨大的“审计点”表,其中一些点是“自动化的”。如果它们是自动化的,则会在其行中收到齿轮图标。齿轮图标不是每行接收的唯一图标。每一行,无论是否自动化,都会收到另外两个图标,一支铅笔和一个切换按钮。当自动点“运行”时,齿轮图标旋转直至完成“运行”。我已经实现了一些代码来同时运行所有这些点但我有一个小问题。当你点击我的按钮运行所有这些点时,我提到的所有三个图标都会旋转,这不是我要找的结果。在我的代码片段中注释掉的行(以及它的匹配括号)将阻止代码运行所有自动点。注释掉该行是导致所有图标旋转的原因。我知道这条线是必需的,以使自动点正常运行,因为它在单个执行自动点时使用我只是不知道要改变它。它显然不应该是点击,因为你不再点击齿轮图标来获得一个点运行我只是不知道该改变它的内容,但该点击功能中的类与齿轮图标有关。

希望这是一个非常容易解决的问题,不会浪费任何人的时间。谢谢!

private updateAuto() {
        var self = this;
        $(".auditPointRow").each(function () {
            //self.el.on("click", ".update, .edit", function () {                    
                var row = $(this).closest(".auditPointRow");
                var id = row.data("id");
                var automated = (<string>row.data("automated")).toLowerCase() == "true";
                var running = true;
                if (automated && $(this).closest(".edit").length == 0) {
                    var gear = $(this).find(".fa");
                    var maxTurns = 120;
                    gear.css("transition", "transform linear " + maxTurns * 2 + "s");
                    gear.css("transform", "rotate(" + (maxTurns * 360) + "deg)");
                    var request = $.ajax(self.root + "api/sites/" + self.site.ID + "/auditpoints/" + id, {
                        "type": "PATCH", data: JSON.stringify([
                            {
                                Op: "Replace"
                                , Path: "/score"
                                , Value: "run"
                            }
                        ])
                    });
                    request.done(function () {
                        gear.css("transition", "").css("transform", "rotate(0deg)");
                        row.prev().find("td").css("background-color", "");
                        if (row.prev().qtip("api")) {
                            row.prev().qtip("api").destroy(true);
                        }
                    });
                }
            //}
        });
    }

1 个答案:

答案 0 :(得分:0)

我想我找到了解决问题的方法。我再次使用.each来完成所有&#34;齿轮&#34;并且只旋转它们。

private updateAuto() {
    var self = this;
    //$(".auditPointRow").each(function () {
        $(".update, .edit").each(function () {                    
              //Left out the rest of the code so this answer isn't too 
              //long, none of it changed if that matters.
        });
    //});
}

由于某种原因,结果运行得很慢(但它运行了!)我不知道为什么如果有人有任何更好的建议/优化,请随时留下这些。

编辑:我意识到我没有经过.each两次,那是什么速度慢下来所以我首先删除了每个审核点,然后只做了齿轮代替。