zone.js：140未捕获TypeError：无法读取属性'remove'

本文介绍了zone.js：140未捕获TypeError：无法读取属性'remove'的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 我是kendo ui的新手。 我在我的小提琴中开发了原型。删除确认窗口在那里正常工作。 但是当我在我的代码库中集成时，出现错误无法在行pai_to_delete.remove（）; 处读取属性'remove' b $ b 你们可以告诉我如何解决这个问题。 在下面提供我的代码。 已更新 - 可能是我没有正确解释您的情况...当我点击某个链接时，一个大的弹出窗口打开一个网格......在那个网格中，当我点击一列时a带有删除选项的小弹出窗口打开了......当我点击删除选项时，一个确认窗口打开... - 当我使用本地js确认方法它工作正常..我认为那时候它的引用正确... - 但是当我使用kendo ui popup时它不能正常工作... - 是我的pai_to_delete当我使用kendo ui时没有正确引用......因为它指的是那个div而不是父div我认为是这样。 原型小提琴 http://jsfiddle.net/amu6tw2a/ 整个代码我不是能粘贴在我的问题中，所以我粘贴在小提琴中，我粘贴在下面的相关代码 https://jsfiddle.net/44tLx225/ zone.js：140 Uncaught TypeError：无法读取属性'删除'在HTMLButtonElement.eval处为null （游泳 - jumpings.ts：990）在HTMLDocument.dispatch（jQuery - 2.2.3。 js：4737） at HTMLDocument.elemData.handle（jquery - 2.2.3。js：4549） ZoneDelegate.invokeTask（zone.js：236） Zone.runTask（zone .js：136） at HTMLDocument.ZoneTask.invoke（zone.js：304） $ b $（。tiger）。bind（click，function e）{ 让= this; $（。pai-del-menu ）.blur（function（）{ $（this）.hide（）; pai_to_delete = null; }）; $（。pai- （）函数（）{ $（this）.hide（）; //让popup = $（＃deletePopup）。data（kendoWindow）。center （）.open（）; if（pai_to_delete！= null）{ // $（'。addELFDocumentForm'）。show（）; // alert（你确定你'; var kendoWindow = $（< div />）。kendoWindow（{ title：Confirm， resizable ：false， modal：true， height：100， width：400 }）; kendoWindow .data（kendoWindow） .content（$（＃delete-confirmation）。html（）） .center（）。open（）; $ b $（跳转）.on（click，#playerDocumentOk，function（）{ pai_to_delete.remove（）; kendoWindow.data（kendoWindow） .close（）; }） $（跳转）.on（click，#playerDocumentCancel，function（）{ kendoWindow.data （kendoWindow）。close（）; }） //pai_to_delete.remove（）; } }）; var record_x = e.pageX; var record_y = e.pageY - $（。navHeaderBox）。height（） - $（。breadCrumbBox）。height（） - 20; （b $（。pai-del-menu））。 $（。pai-del-menu）。fadeIn（200）; $（。pai-del-menu）。show（）; $（。pai-del-menu）。attr（'tabindex'，-1）.focus（）; pai_to_delete = $（this）.parent（）。parent（）; }）; 使用js本地确认方式 $（。tiger）。bind（click，function（e）{ pai_to_delete = null; $） $（。pai-del-menu）。click（function（）{ $（this）.hide（）; 如果（pai_to_delete！== null）{ // alert（您确定要删除所选文档）; // confirm（您确定要删除选定的文档）; var r = confirm（您确定要删除所选文档）; if（r == true）{ // txt = ;您按OK！; pai_to_delete.remove（）; } else { // txt =您按下取消！; } // pai_to_delete.remove（）; } }）; var pai_x = e.pageX; var pai_y = e.pageY - $（。navHeaderBox）。height（） - $（。breadCrumbBox）。height（） - 20; $（.pai-del-menu）.css（{ left：pai_x， top：pai_y }）; $（。pai-del-menu）。fadeIn（200）; $（。pai-del-menu）。show（）; $（。pai-del-menu）。attr（'tabindex'，-1）.focus（）; pai_to_delete = $（this）.parent（）。parent（）; }）; 解决方案原生确认方法和自定义模态窗口 - 本地确认方法是同步的。 当方法是同步的并且您在本地确认对话框中单击Ok / Cancel时， $（。pai-del-menu）。blur 甚至会发生，但只有在 $（。pai-del-menu）后才会执行，点击完成，所以一切正常。 当方法是异步的并且您在模式窗口上单击确定/取消时， $（。pai-del-menu）。blur 甚至会立即执行并删除 pai_to_delete 引用，因此在 $（。pai-del-menu）中单击事件 pai_to_delete 已经是 null 。 您只需在 kendoWindow 创建之前将 pai_to_delete 赋值给另一个变量，并在 $（.pai-del-menu）。click event： $（ （）; $ b $（this）.hide（）; pai_to_delete = null; }）; （）。 $ b $（。pai-del-menu）。click（function（）{ $（this）.hide（）; if（pai_to_delete！= null） { var paiToDelete = pai_to_delete; //< ---- var kendoWindow = $（< div />）。 resizable：false， modal：true， height：100， width：400 }）; kendoWindow.data（ （）; .content（$（＃delete-confirmation）。html（）） .center（）。open（）; $（跳转） .on（click，#playerDocumentOk，function（）{ paiToDelete.remove（）; //< ---- kendoWindow.data（kendoWindow）。close（） ; $）; $（跳转）.on（click，#playerDocumentCancel，function（）{ kendoWindow.data（kendoWindow）。close （）; }）; } }）;I am new to kendo ui.I developed prototype in my fiddle. delete confirmation window is working fine there.but when I integrate in my codebase I am getting error Cannot read property 'remove' at the line pai_to_delete.remove();can you guys tell me how to fix it.providing my code below.updated-may be I did not explain you properly...how my ui looks is when I click a link a big popup opens with a grid...in that grid when i click a columna small popup with delete option opens up...when I click the delete option a confirmation window opens...- when I use native js confirm method it works fine..I think that time its referring correctly...- but when I use kendo ui popup it does not work fine...- is my pai_to_delete not referring properly when I use kendo ui...since its referring to that div not the parent div i think so.prototype fiddlehttp://jsfiddle.net/amu6tw2a/whole code I am not able to paste in my question so I am pasting in fiddle, relevant code I am pasting belowhttps://jsfiddle.net/44tLx225/zone.js: 140 Uncaught TypeError: Cannot read property 'remove'of nullat HTMLButtonElement.eval(swimming - jumpings.ts: 990)at HTMLDocument.dispatch(jquery - 2.2.3. js: 4737)at HTMLDocument.elemData.handle(jquery - 2.2.3. js: 4549)at ZoneDelegate.invokeTask(zone.js: 236)at Zone.runTask(zone.js: 136)at HTMLDocument.ZoneTask.invoke(zone.js: 304)$(".tiger").bind("click", function(e) { let that = this; $(".pai-del-menu").blur(function() { $(this).hide(); pai_to_delete = null; }); $(".pai-del-menu").click(function() { $(this).hide(); //let popup = $("#deletePopup").data("kendoWindow").center().open(); if (pai_to_delete != null) { //$('.addELFDocumentForm').show(); //alert("Are you sure you want to delete the selected jumping"); var kendoWindow = $("<div />").kendoWindow({ title: "Confirm", resizable: false, modal: true, height: 100, width: 400 }); kendoWindow.data("kendoWindow") .content($("#delete-confirmation").html()) .center().open(); $(jumping).on("click", "#playerDocumentOk", function() { pai_to_delete.remove(); kendoWindow.data("kendoWindow").close(); }) $(jumping).on("click", "#playerDocumentCancel", function() { kendoWindow.data("kendoWindow").close(); }) //pai_to_delete.remove(); } }); var record_x = e.pageX; var record_y = e.pageY - $(".navHeaderBox").height() - $(".breadCrumbBox").height() - 20; $(".pai-del-menu").css({ left: record_x, top: record_y }); $(".pai-del-menu").fadeIn(200); $(".pai-del-menu").show(); $(".pai-del-menu").attr('tabindex', -1).focus(); pai_to_delete = $(this).parent().parent();});works with js native confirm method$(".tiger").bind("click", function(e) { $(".pai-del-menu").blur(function() { $(this).hide(); pai_to_delete = null; }); $(".pai-del-menu").click(function() { $(this).hide(); if (pai_to_delete !== null) { //alert("Are you sure you want to delete the selected document"); //confirm("Are you sure you want to delete the selected document"); var r = confirm("Are you sure you want to delete the selected document"); if (r == true) { //txt = "You pressed OK!"; pai_to_delete.remove(); } else { //txt = "You pressed Cancel!"; } //pai_to_delete.remove(); } }); var pai_x = e.pageX; var pai_y = e.pageY - $(".navHeaderBox").height() - $(".breadCrumbBox").height() - 20; $(".pai-del-menu").css({ left: pai_x, top: pai_y }); $(".pai-del-menu").fadeIn(200); $(".pai-del-menu").show(); $(".pai-del-menu").attr('tabindex', -1).focus(); pai_to_delete = $(this).parent().parent(); }); 解决方案 The key difference between native confirm method and custom modal window - native confirm method is synchronous.When method is synchronous and you clicks Ok/Cancel in native confirm dialog, $(".pai-del-menu").blur even occurs, but executes only after $(".pai-del-menu").click was finished, so everything works fine.When method is asynchronous and you clicks Ok/Cancel on modal window, $(".pai-del-menu").blur even occurs and executes immediately, removing pai_to_delete reference, so inside $(".pai-del-menu").click event pai_to_delete is already null.All you need is to assign pai_to_delete to another variable right before kendoWindow creation and use it inside $(".pai-del-menu").click event: $(".pai-del-menu").blur(function() { $(this).hide(); pai_to_delete = null;});$(".pai-del-menu").click(function() { $(this).hide(); if (pai_to_delete != null) { var paiToDelete = pai_to_delete; // <---- var kendoWindow = $("<div />").kendoWindow({ title: "Confirm", resizable: false, modal: true, height: 100, width: 400 }); kendoWindow.data("kendoWindow") .content($("#delete-confirmation").html()) .center().open(); $(jumping).on("click", "#playerDocumentOk", function() { paiToDelete.remove(); // <---- kendoWindow.data("kendoWindow").close(); }); $(jumping).on("click", "#playerDocumentCancel", function() { kendoWindow.data("kendoWindow").close(); }); }}); 这篇关于zone.js：140未捕获TypeError：无法读取属性'remove'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！