解决UpdatePanel和Repeater搭配使用时出现行错位的问题-阿里云开发者社区

解决UpdatePanel和Repeater搭配使用时出现行错位的问题

2017-11-21 1068

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

最近的项目里面使用了比较多的UpdatePanel和repeater搭配使用，但是在IE9里面常常会出现这样一个问题：当显示非常多的数据时，总有一行或几行错位，从而导致样式乱掉了。本来使用UpdatePanel是为了简化自己的工作并提升下用户体验，这样一来有违初衷。其实完全可以不使用UpdatePanel，而是手动写ajax去实现，但是时间比较紧，而用到UpdatePanel的地方的确比较多，改起来比较费时，还是打算在此基础上去修改，通过在IE9下查看源文件发现了每一个td的文本都有很多空格，所以尝试了使用js在页面加载完成以后去除没一个td里面的空格，但是这并没有起作用，后来同事说是td与td之间的空格造成的，果断尝试了下，奏效了，呵呵！具体实现如下：

//套用repeater

<table id="evtList">
    <thead>                    
        <tr><th></th></tr>
            ...
    </thead>
    <tbody>
        <asp:Repeater ID="rptList" runat="server">
            <ItemTemplate>
            <tr><td></td></tr>
            ...
            </ItemTemplate>
        </asp:Repeater>

    </tbody>
</table>

在加载完成后，后台注册一个js脚本，如下：

    var bro=$.browser;//只需要对IE9进行处理

function formatTable() {

if(bro.msie&&bro.version=="9.0")

{
           $.each($("#evtList tr"), function (i, item) {  //遍历每一行
               $(item).html($.trim($(item).html()));
           });

}
    }

其实方法就是这么简单，呵呵！从网上搜了很多，没有很清楚的答案，这里记下备用！

本文转自Rt-张雪飞博客园博客，原文链接http://www.cnblogs.com/mszhangxuefei/archive/2012/06/27/worknotes_5.html如需转载请自行联系原作者

张雪飞