asp.net – 访问offsetParent时是否存在IE 6/7“未指定错误”错误的解决方法

asp.Net 前端之家
前端之家收集整理的这篇文章主要介绍了asp.net – 访问offsetParent时是否存在IE 6/7“未指定错误”错误的解决方法，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
我在一个简单的ASP.NET概念验证应用程序中使用jQuery UI的可拖动和可放置库.此页面使用ASP.NET AJAX UpdatePanel进行部分页面更新.该页面允许用户将项目放入垃圾桶div,它将调用从数据库中删除记录的回发,然后重新绑定该项目为药物的列表(以及其他控件).所有这些元素(可拖动项和垃圾桶div)都在ASP.NET UpdatePanel中.

这是拖放初始化脚本：

  1. function initDragging()
  2.     {
  3.         $(".person").draggable({helper:'clone'});
  4.         $("#trashcan").droppable({
  5.             accept: '.person',tolerance: 'pointer',hoverClass: 'trashcan-hover',activeClass: 'trashcan-active',drop: onTrashCanned
  6.         });
  7.     }
  8.  
  9.     $(document).ready(function(){
  10.         initDragging();
  11.  
  12.         var prm = Sys.WebForms.PageRequestManager.getInstance();
  13.         prm.add_endRequest(function()
  14.         {
  15.             initDragging();
  16.         });
  17.     });
  18.  
  19.     function onTrashCanned(e,ui)
  20.     {
  21.         var id = $('input[id$=hidID]',ui.draggable).val();
  22.         if (id != undefined)
  23.         {
  24.             $('#hidTrashcanID').val(id);
  25.             __doPostBack('btnTrashcan','');
  26.         }
  27.  
  28.     }

当页面回发,部分更新UpdatePanel的内容时,我重新绑定了draggables和droppables.当我用光标抓住一个draggable时,我得到一个“htmlfile：Unspecified error”.例外.我可以通过将elem.offsetParent替换为我写的这个函数的调用来解决jQuery库中的这个问题：

  1. function IESafeOffsetParent(elem)
  2. {
  3.     try
  4.     {
  5.         return elem.offsetParent;
  6.     }
  7.     catch(e)
  8.     {        
  9.         return document.body;
  10.     }
  11. }

我还必须避免调用elem.getBoundingClientRect(),因为它会抛出相同的错误.对于那些感兴趣的人,我只需要在Dimensions Plugin中的jQuery.fn.offset函数中进行这些更改.

我的问题是：

>虽然这有效,但有没有更好的方法(更干净;更好的性能;无需修改jQuery库)来解决这个问题？
>如果没有,在将来更新jQuery库时,管理保持变化同步的最佳方法是什么？例如,我可以将库扩展到我从jQuery网站下载的文件中的内联之外的其他位置.

更新：

@some它不公开,但我会看到SO是否允许我将相关代码发布到这个答案中.只需创建一个ASP.NET Web应用程序(将其命名为DragAndDrop)并创建这些文件即可.不要忘记将Complex.aspx设置为起始页面.您还需要下载jQuery UI drag and drop plug in以及jQuery core

Complex.aspx

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Complex.aspx.cs" Inherits="DragAndDrop.Complex" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml" >
  6. <head runat="server">
  7.     <title>Untitled Page</title>
  8.     <script src="jquery-1.2.6.min.js" type="text/javascript"></script>
  9.     <script src="jquery-ui-personalized-1.5.3.min.js" type="text/javascript"></script>
  10.     <script type="text/javascript">
  11.         function initDragging()
  12.         {
  13.             $(".person").draggable({helper:'clone'});
  14.             $("#trashcan").droppable({
  15.                 accept: '.person',drop: onTrashCanned
  16.             });
  17.         }
  18.  
  19.         $(document).ready(function(){
  20.             initDragging();
  21.  
  22.             var prm = Sys.WebForms.PageRequestManager.getInstance();
  23.             prm.add_endRequest(function()
  24.             {
  25.                 initDragging();
  26.             });
  27.         });
  28.  
  29.         function onTrashCanned(e,ui)
  30.         {
  31.             var id = $('input[id$=hidID]',ui.draggable).val();
  32.             if (id != undefined)
  33.             {
  34.                 $('#hidTrashcanID').val(id);
  35.                 __doPostBack('btnTrashcan','');
  36.             }
  37.  
  38.         }
  39.     </script>
  40. </head>
  41. <body>
  42.     <form id="form1" runat="server">
  43.     <asp:ScriptManager ID="ScriptManager1" runat="server">
  44.     </asp:ScriptManager>
  45.     <div>
  46.         <asp:UpdatePanel ID="updContent" runat="server" UpdateMode="Always">
  47.     <ContentTemplate>
  48.         <asp:LinkButton ID="btnTrashcan" Text="trashcan" runat="server" CommandName="trashcan" 
  49.             onclick="btnTrashcan_Click" style="display:none;"></asp:LinkButton>
  50.         <input type="hidden" id="hidTrashcanID" runat="server" />
  51.         <asp:Button ID="Button1" runat="server" Text="Save" onclick="Button1_Click" />
  52.         <table>
  53.             <tr>
  54.                 <td style="width: 300px;">
  55.                     <asp:DataList ID="lstAllPeople" runat="server" DataSourceID="odsAllPeople"
  56.                         DataKeyField="ID">
  57.                         <ItemTemplate>
  58.                             <div class="person">
  59.                                 <asp:HiddenField ID="hidID" runat="server" Value='<%# Eval("ID") %>' />
  60.                                 Name:
  61.                                 <asp:Label ID="lblName" runat="server" Text='<%# Eval("Name") %>' />
  62.                                 <br />
  63.                                 <br />
  64.                             </div>
  65.                         </ItemTemplate>
  66.                     </asp:DataList>
  67.                     <asp:ObjectDataSource ID="odsAllPeople" runat="server" SelectMethod="SelectAllPeople" 
  68.                         TypeName="DragAndDrop.Complex+DataAccess" 
  69.                         onselecting="odsAllPeople_Selecting">
  70.                         <SelectParameters>
  71.                             <asp:Parameter Name="filter" Type="Object" />
  72.                         </SelectParameters>
  73.                     </asp:ObjectDataSource>
  74.                 </td>
  75.                 <td style="width: 300px;vertical-align:top;">
  76.                     <div id="trashcan">
  77.                         drop here to delete
  78.                     </div>
  79.                     <asp:DataList ID="lstPeopleToDelete" runat="server" 
  80.                         DataSourceID="odsPeopleToDelete">
  81.                         <ItemTemplate>
  82.                             ID:
  83.                             <asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' />
  84.                             <br />
  85.                             Name:
  86.                             <asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
  87.                             <br />
  88.                             <br />
  89.                         </ItemTemplate>
  90.                     </asp:DataList>
  91.                     <asp:ObjectDataSource ID="odsPeopleToDelete" runat="server" 
  92.                         onselecting="odsPeopleToDelete_Selecting" SelectMethod="GetDeleteList" 
  93.                         TypeName="DragAndDrop.Complex+DataAccess">
  94.                         <SelectParameters>
  95.                             <asp:Parameter Name="list" Type="Object" />
  96.                         </SelectParameters>
  97.                     </asp:ObjectDataSource>
  98.                 </td>
  99.             </tr>
  100.         </table>    
  101.     </ContentTemplate>
  102.     </asp:UpdatePanel>
  103.     </div>
  104.     </form>
  105. </body>
  106. </html>

Complex.aspx.cs

  1. namespace DragAndDrop
  2. {
  3.     public partial class Complex : System.Web.UI.Page
  4.     {
  5.         protected void Page_Load(object sender,EventArgs e)
  6.         {
  7.         }
  8.  
  9.         protected List<int> DeleteList
  10.         {
  11.             get
  12.             {
  13.                 if (ViewState["dl"] == null)
  14.                 {
  15.                     List<int> dl = new List<int>();
  16.                     ViewState["dl"] = dl;
  17.  
  18.                     return dl;
  19.                 }
  20.                 else
  21.                 {
  22.                     return (List<int>)ViewState["dl"];
  23.                 }
  24.             }
  25.         }
  26.  
  27.         public class DataAccess
  28.         {
  29.             public IEnumerable<Person> SelectAllPeople(IEnumerable<int> filter)
  30.             {
  31.                 return Database.SelectAll().Where(p => !filter.Contains(p.ID));
  32.             }
  33.  
  34.             public IEnumerable<Person> GetDeleteList(IEnumerable<int> list)
  35.             {
  36.                 return Database.SelectAll().Where(p => list.Contains(p.ID));
  37.             }
  38.         }
  39.  
  40.         protected void odsAllPeople_Selecting(object sender,ObjectDataSourceSelectingEventArgs e)
  41.         {
  42.             e.InputParameters["filter"] = this.DeleteList;
  43.         }
  44.  
  45.         protected void odsPeopleToDelete_Selecting(object sender,ObjectDataSourceSelectingEventArgs e)
  46.         {
  47.             e.InputParameters["list"] = this.DeleteList;
  48.         }
  49.  
  50.         protected void Button1_Click(object sender,EventArgs e)
  51.         {
  52.             foreach (int id in DeleteList)
  53.             {
  54.                 Database.DeletePerson(id);
  55.             }
  56.  
  57.             DeleteList.Clear();
  58.             lstAllPeople.DataBind();
  59.             lstPeopleToDelete.DataBind();
  60.         }
  61.  
  62.         protected void btnTrashcan_Click(object sender,EventArgs e)
  63.         {
  64.             int id = int.Parse(hidTrashcanID.Value);
  65.             DeleteList.Add(id);
  66.             lstAllPeople.DataBind();
  67.             lstPeopleToDelete.DataBind();
  68.         }
  69.     }
  70. }

Database.cs

  1. namespace DragAndDrop
  2. {
  3.     public static class Database
  4.     {
  5.         private static Dictionary<int,Person> _people = new Dictionary<int,Person>();
  6.         static Database()
  7.         {
  8.             Person[] people = new Person[]
  9.             {
  10.                 new Person("Chad"),new Person("Carrie"),new Person("Richard"),new Person("Ron")
  11.             };
  12.             foreach (Person p in people)
  13.             {
  14.                 _people.Add(p.ID,p);
  15.             }
  16.         }
  17.  
  18.         public static IEnumerable<Person> SelectAll()
  19.         {
  20.             return _people.Values;
  21.         }
  22.  
  23.         public static void DeletePerson(int id)
  24.         {
  25.             if (_people.ContainsKey(id))
  26.             {
  27.                 _people.Remove(id);
  28.             }
  29.         }
  30.  
  31.         public static Person CreatePerson(string name)
  32.         {
  33.             Person p = new Person(name);
  34.             _people.Add(p.ID,p);
  35.  
  36.             return p;
  37.         }
  38.     }
  39.  
  40.     public class Person
  41.     {
  42.         private static int _curID = 1;
  43.         public int ID { get; set; }
  44.         public string Name { get; set; }
  45.         public Person()
  46.         {
  47.             ID = _curID++;
  48.         }
  49.  
  50.         public Person(string name)
  51.             : this()
  52.         {
  53.             Name = name;
  54.         }
  55.     }
  56. }

解决方法

@arilanto – 我在jquery脚本之后包含了这个脚本.性能方面,它不是最好的解决方案,但它是一个快速简单的解决方案. 
  1. function IESafeOffsetParent(elem)
  2. {
  3.     try
  4.     {
  5.        return elem.offsetParent;
  6.     }
  7.     catch(e)
  8.     {        
  9.       return document.body;
  10.     }
  11. }
  12.  
  13. // The Offset Method
  14. // Originally By Brandon Aaron,part of the Dimension Plugin
  15. // http://jquery.com/plugins/project/dimensions
  16. jQuery.fn.offset = function() {
  17. /// <summary>
  18. ///     Gets the current offset of the first matched element relative to the viewport.
  19. /// </summary>
  20. /// <returns type="Object">An object with two Integer properties,'top' and 'left'.</returns>
  21.  
  22. var left = 0,top = 0,elem = this[0],results;
  23.  
  24. if ( elem ) with ( jQuery.browser ) {
  25.     var parent     = elem.parentNode,offsetChild  = elem,offsetParent = IESafeOffsetParent(elem),doc       = elem.ownerDocument,safari2   = safari && parseInt(version) < 522 && !/adobeair/i.test(userAgent),css       = jQuery.curCSS,fixed       = css(elem,"position") == "fixed";
  26.  
  27.     // Use getBoundingClientRect if available
  28.     if (false && elem.getBoundingClientRect) {
  29.         var Box = elem.getBoundingClientRect();
  30.  
  31.         // Add the document scroll offsets
  32.         add(Box.left + Math.max(doc.documentElement.scrollLeft,doc.body.scrollLeft),Box.top  + Math.max(doc.documentElement.scrollTop,doc.body.scrollTop));
  33.  
  34.         // IE adds the HTML element's border,by default it is medium which is 2px
  35.         // IE 6 and 7 quirks mode the border width is overwritable by the following css html { border: 0; }
  36.         // IE 7 standards mode,the border is always 2px
  37.         // This border/offset is typically represented by the clientLeft and clientTop properties
  38.         // However,in IE6 and 7 quirks mode the clientLeft and clientTop properties are not updated when overwriting it via CSS
  39.         // Therefore this method will be off by 2px in IE while in quirksmode
  40.         add( -doc.documentElement.clientLeft,-doc.documentElement.clientTop );
  41.  
  42.     // Otherwise loop through the offsetParents and parentNodes
  43.     } else {
  44.  
  45.         // Initial element offsets
  46.         add( elem.offsetLeft,elem.offsetTop );
  47.  
  48.         // Get parent offsets
  49.         while ( offsetParent ) {
  50.             // Add offsetParent offsets
  51.             add( offsetParent.offsetLeft,offsetParent.offsetTop );
  52.  
  53.             // Mozilla and Safari > 2 does not include the border on offset parents
  54.             // However Mozilla adds the border for table or table cells
  55.             if ( mozilla && !/^t(able|d|h)$/i.test(offsetParent.tagName) || safari && !safari2 )
  56.                 border( offsetParent );
  57.  
  58.             // Add the document scroll offsets if position is fixed on any offsetParent
  59.             if ( !fixed && css(offsetParent,"position") == "fixed" )
  60.                 fixed = true;
  61.  
  62.             // Set offsetChild to prevIoUs offsetParent unless it is the body element
  63.             offsetChild  = /^body$/i.test(offsetParent.tagName) ? offsetChild : offsetParent;
  64.             // Get next offsetParent
  65.             offsetParent = offsetParent.offsetParent;
  66.         }
  67.  
  68.         // Get parent scroll offsets
  69.         while ( parent && parent.tagName && !/^body|html$/i.test(parent.tagName) ) {
  70.             // Remove parent scroll UNLESS that parent is inline or a table to work around Opera inline/table scrollLeft/Top bug
  71.             if ( !/^inline|table.*$/i.test(css(parent,"display")) )
  72.                 // Subtract parent scroll offsets
  73.                 add( -parent.scrollLeft,-parent.scrollTop );
  74.  
  75.             // Mozilla does not add the border for a parent that has overflow != visible
  76.             if ( mozilla && css(parent,"overflow") != "visible" )
  77.                 border( parent );
  78.  
  79.             // Get next parent
  80.             parent = parent.parentNode;
  81.         }
  82.  
  83.         // Safari <= 2 doubles body offsets with a fixed position element/offsetParent or absolutely positioned offsetChild
  84.         // Mozilla doubles body offsets with a non-absolutely positioned offsetChild
  85.         if ( (safari2 && (fixed || css(offsetChild,"position") == "absolute")) ||
  86.             (mozilla && css(offsetChild,"position") != "absolute") )
  87.                 add( -doc.body.offsetLeft,-doc.body.offsetTop );
  88.  
  89.         // Add the document scroll offsets if position is fixed
  90.         if ( fixed )
  91.             add(Math.max(doc.documentElement.scrollLeft,Math.max(doc.documentElement.scrollTop,doc.body.scrollTop));
  92.     }
  93.  
  94.     // Return an object with top and left properties
  95.     results = { top: top,left: left };
  96. }
  97.  
  98. function border(elem) {
  99.     /// <summary>
  100.     ///     This method is internal.
  101.     /// </summary>
  102.     /// <private />
  103.     add( jQuery.curCSS(elem,"borderLeftWidth",true),jQuery.curCSS(elem,"borderTopWidth",true) );
  104. }
  105.  
  106. function add(l,t) {
  107.     /// <summary>
  108.     ///     This method is internal.
  109.     /// </summary>
  110.     /// <private />
  111.     left += parseInt(l,10) || 0;
  112.     top += parseInt(t,10) || 0;
  113. }
  114.  
  115. return results;
  116. };

猜你在找的asp.Net相关文章

.NetCore+WebUploader实现大文件分片上传
项目要求通过网站上传大文件，比如视频文件，通过摸索实现了文件分片来上传，然后后台进行...
CentOS7下让Asp.Net Core的网站自动运行
安装新版本的Nginx（vim /etc/yum.repos.d/nginx.repo） [nginx-stable] name=nginx stabl...
使用SignalR ASP.NET Core来简单实现一个后台实时推送数据给Echarts展示图表的功能
什么是 SignalR&#160;ASP.NET Core ASP.NET Core SignalR 是一种开放源代码库，可简化...
.NETCore项目在Windows下构建Docker镜像并本地导出分发到CentOS系统下
在Windows下使用Docker，我们选择Docker Desktop这个软件，非常方便。 ## Docker Desktop介...
C#编写运行在Linux环境下的采用Mediainfo来获取多媒体文件信息的代码
项目开始设计的是运行在windows下，所以一开始采用的是windows服务模式来获取多媒体文件信...
Blazor Server App Cannot find the fallback endpoint specified by route values
github官方issues中提到的解决方案，CreateBuilder时指定项目绝对路径可以解决。 1 // 指定...
ASP.NET CORE使用WebUploader对大文件分片上传，并通过ASP.NET CORE SignalR实时反馈后台处理进度给前端展示
本次，我们来实现一个单个大文件上传，并且把后台对上传文件的处理进度通过ASP.NET CORE S...
解决WPF+Avalonia在openKylin系统下默认字体问题
一、openKylin简介 openKylin（开放麒麟） 社区是在开源、自愿、平等和协作的基础上，由基...
WTM的项目中EFCore如何适配人大金仓数据库
一、WTM是什么 WalkingTec.Mvvm框架（简称WTM）最早开发与2013年，基于Asp.net MVC3 和 最...
实现ASP.Net Core3.1运行在DockeDesktop下并用Nginx实现负载均衡
一、首先去https://docs.docker.com/get-docker/下载Windows版本的Docker Desktop并安装（...
PHPJavaJava SEPythonC#C&C++RubyVBasp.NetGoPerlnettyDjangoDelphiJsp.NET CoreSpringFlaskSpringbootSpringMVCLuaLaravelMybatisAspGroovyThinkPHPYiiswoole
文件时间pythonm相等性PHP Warning时间问题问题解决pcntl_signal采样点wav模块动态文本调用频率限制对外暴露多个访问请求更新数据表模型结构type()方法比较速度手写体sobel算子保存模型Image类nn.Conv2dpytorch1.0kaggleDCGAN交并比range()用法打印模型反卷积卷积