jquery弹出必须按两次“确定”两次才能使其消失

Question

我有一个问题，我试图找出为什么我必须按两次弹出按钮的“确定”按钮才能使其消失。我可以从我的代码中看到我只有一个警报语句，但它的行为就像我可能不小心调用了两个警报语句一样

function intialiseKendoGrid(date) {
     gridResult = $('#grid').kendoGrid({
         scrollable: {
             virtual: true
         },
         navigatable: true,
         groupable: true,
         sortable: true,
         selectable: "row",
         pageable: true,

         pageable: {
             input: true,
             numeric: false
         },

         resizable: true,
         reorderable: true,
         filterable: {
             extra: false
         },
         columns: [{
             field: "DealNumber",
             width: 150,
             title: "DealNumber",

             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }

             },
         },
         {
             field: "DealIssuer",
             width: 150,
             title: "Issuer",
             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             },
             //template: "<a href='http://manager.dealogic.com/ManagerV3/CPCortex/Default/${DealNumber}'>${DealNumber}</a>"  
             template: "<a>${DealIssuer}</a>"

         }, {
             field: "Ticker",
             width: 150,
             title: "Ticker",
             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             }    
         }, {
             field: "DealExchange",
             width: 150,
             title: "Exchange",
             filterable: {
                 operators: {

                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             }
         }, {
             field: "DealType",
             width: 150,
             title: "Type",
             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             }

         }, {
             field: "DealValue",
             width: 150,
             title: "Value ($m)",
             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             },
             /*   template: '#= kendo.culture("en-US");kendo.toString(${DealValue/1000000},"p")#' */

             template: '#= kendo.toString(DealValue,"c2") #'

         }, {
             field: "DealStatus",
             width: 150,
             title: "Status",
             filterable: {
                 operators: {
                     string: {
                         startswith: "Starts With",
                         contains: "Contains"
                     }
                 }
             }

         }, {
             field: "DealPricingCompletionDate",
             width: 230,
             title: "DealPricingCompletionDate",
             format: "{0:dd/MM/yyyy}",
             filterable: {
                 ui: "datetimepicker",
                 operators: {
                     date: {
                         gt: "After",
                         lt: "Before",
                         eq: "Equals"
                     },
                     messages: {
                         filter: "Apply",
                         clear: "Clear"
                     }
                 }

             }
         },   
         ],

         change: function () {
             var text = "";
             var grid = this;
             grid.select().each(function () {
                 var dataItem = grid.dataItem($(this));
                 text += "DealNumber: " + dataItem.DealNumber + "\n" + "Issuer: " + dataItem.DealIssuer + "\n" + "Ticker: " + dataItem.Ticker + "\n" + "Type: " + dataItem.DealType + "\n" + "Value: " + dataItem.DealValue + "\n" +
                     "Status " + dataItem.DealStatus + "\n" + "DealPricingCompletionDate: " + kendo.toString(dataItem.DealPricingCompletionDate, "dd/MM/yyyy");
             });
             alert(text);
         },
         height: 700
     }).data("kendoGrid");

Answer 1

change事件被触发了两次，由于alert()绑定了change事件，所以也会弹出两次。

看看change event documentation。它是“当用户在网格中选择表格行或单元格时触发。”

也许它被触发了两次，一次用于行，一次用于单元格？虽然我看到你有 selectable: "row" 所以它应该只为该行触发。

将您的更改事件更新为change: function (e) { console.log(e); }，然后查看它在您的调试控制台中输出的内容。这将提示您触发它的元素。

然后您可以尝试将e.preventDefault(); 添加到您的更改事件中，以阻止任何其他事件被触发。

Answer 2

经过长时间的延迟，它现在被破解了。 我所要做的就是通过超时使用 SetTimeOut 方法为 0，这意味着不指定任何时间参数。 所以固定的代码是

    function onRowSelected(e) {
        e.preventDefault();
        console.log(e.sender);
        var text = "";
        var grid = this;
        grid.select().each(function () {
            var dataItem = grid.dataItem($(this));
            text += "DealNumber: " + dataItem.DealNumber + "\n" + "Issuer: " +
                dataItem.DealIssuer + "\n" + "Ticker: " + dataItem.Ticker + "\n" + "Type: " + dataItem.DealType + "\n" + "Value: " + dataItem.DealValue + "\n" +
                "Status " + dataItem.DealStatus + "\n" + "DealPricingCompletionDate: " + kendo.toString(dataItem.DealPricingCompletionDate, "dd/MM/yyyy");
        });
        setTimeout(function () { alert(text) },0);

    }