FineUI 官方论坛

标题: IE7下弹出窗口出现滚动条时Alert出现JS错误 [打印本页]

作者: 泗水亭长 时间: 2012-3-30 16:37
标题: IE7下弹出窗口出现滚动条时Alert出现JS错误
在IE7下，弹出一个ext window窗口，window窗口里的页面如果高度超过了window的高度时，window会自动出现滚动条。出现滚动条后就会引发一些问题。比如 ext button不响应，alert报JS错误。其中以alert报错最为要命，因为找不到其他替代方案。我研究了好久好久也没找到解决办法。希望三石先生关注一下。谢谢

作者: 〓飚〓 时间: 2012-3-30 16:43
贴出代码嘛，暂时没遇到过这样的问题

作者: 泗水亭长 时间: 2012-3-30 16:47

<ext:Button ID="Button1" runat="server" Text="点击此按钮弹出一个带滚动条的window" OnClick="Button1_Click">
</ext:Button>
<br />

<ext:Window ID="EditTaskWin" Title="测试window里滚动条" Hidden="true" EnableIFrame="true" runat="server"
IsModal="true" Width="800px" Height="600px" EnableClose="true" EnableMaximize="true"
Target="

arent" WindowPosition="Center" >
</ext:Window>

下面是弹出窗口页面
<body>
<form id="form1" runat="server">
<ext

ageManager ID="

ageManager1" runat="server" />
<div style="height:800px;">
   <ext:Button ID="btnTest" Text="点击此按钮查看alert是否报错" runat="server"
         onclick="btnTest_Click"></ext:Button>
</div>
</form>
</body>
public partial class TestWindow : System.Web.UI.Page
{
      protected void Page_Load(object sender, EventArgs e)
      {

      }

      protected void btnTest_Click(object sender, EventArgs e)
      {
         ExtAspNet.Alert.Show("出现滚动条后，出错了吗？");
      }
}

作者: 〓飚〓 时间: 2012-3-30 16:58
没出错呀~~

作者: 泗水亭长 时间: 2012-3-30 17:06
IE6 IE9 没问题，IE7有问题，很多网友都已经测试确认了这个问题了

作者: sanshi 时间: 2012-3-30 17:52
这是泗水亭长给我的测试例子： [attach]173[/attach]

这个问题在IE7下的确存在。

作者: sanshi 时间: 2012-3-30 17:56
这个问题在Firefox，IE8，IE9下都不存在，只在IE7下存在，重新步骤：
1. 打开测试页面，单击按钮弹出窗口。
2. 确保弹出窗口出现滚动条，点击显示Alert对话框的按钮。
3. 弹出Alert对话框，此时还没问题。
4. 点击Alert对话框的标题，就报错了。

[attach]174[/attach]

打开extjs源代码，定位到如下片段：
[attach]175[/attach]

调试后发现，在IE7下，进来的node参数可能为null，所以在null.nodeName时自然会出错。

=====================================
其实解决办法很简单，当node不存在时不要往下执行函数了。

这个函数的本意是判断某个节点是否是有效的可拖动DOM节点，node为空时肯定就不是了，所以逻辑上也是对的。

所以，我们可以简单的修改extjs的源代码来解决这个问题：

isValidHandleChild: function(node) {
if(!node){ return false; }
....

复制代码

=====================================
但是上面的做法不太好，尽量不要修改别人的源代码，否则升级时会遇到问题。
没关系，我们只需在外面覆盖这个函数：

// 修正IE7下，窗口出现滚动条时，点击Window控件标题栏有时node为null的问题
var originalIsValidHandleChild = Ext.dd.DragDrop.prototype.isValidHandleChild;
Ext.dd.DragDrop.prototype.isValidHandleChild = function (node) {
if (!node || !node.nodeName) {
return false;
}
return originalIsValidHandleChild.apply(this, [node]);
};

复制代码

解决！

=====================
这个修正会出现在 v3.1.1中，如果你在使用以前的版本，可以下载ExtAspNet的源代码，把上面的一段JS代码加在js/x.js的最后，重新编译工程就行了。

作者: sanshi 时间: 2012-3-30 18:06
@泗水亭长，方便把你们项目放点截图到《基于 ExtAspNet 的项目展示区》。。。

作者: 泗水亭长 时间: 2012-3-30 19:20
好的，我想请问一个问题：
我之前调试虽然也定位到了出错的地方，但为什么我看到的JS代码显示为一行，没有任何格式，可读性非常不好。为什么您截图的出错代码页面是有格式的呢？

作者: 30372245 时间: 2012-3-30 19:51
我找extjs的没压缩源代码调试，不过一般不需要这样，extjs本身出现bug的情况还比较少

作者: 泗水亭长 时间: 2012-3-31 10:25
在安装有IE7以上版本的浏览器的服务器上选择兼容IE7的模式的确问题解决了，但是在只安装IE7的服务器上有滚动条的弹出窗口里的按钮点击后还是无响应。alert提示框里的【确定】按钮点击后也是无响应。大家如果已经安装了IE以上版本，可以用IE tester 新建一个IE7选项卡进行测试。也能重现这个问题。

作者: sanshi 时间: 2012-3-31 20:21
这个BUG找的我好辛苦，一行一行的删除代码，最终定位到了QuickTips，还是extjs本身的浏览器兼容性为题。
现在已经搞定，ChangeSet：75361

+修正原生的IE7（非IE8下的IE7模式）中，iframe中的页面出现滚动条时，页面上的所有按钮都不能点击了（泗水亭长）。
-最终发现是初始化QuickTips时出的问题，必须这样初始化Ext.QuickTips.init(false);，这是Extjs本身的兼容性问题。
-Ext.QuickTips.init - autoReader：True to render the QuickTips container immediately to preload images.。

作者: 泗水亭长 时间: 2012-4-1 12:15
自己顶起来，希望大家关注下。

作者: sanshi 时间: 2012-4-1 14:29

泗水亭长发表于 2012-4-1 12:15
自己顶起来，希望大家关注下。

你确认一下上面的解决方案是否有效，还有你把重复发的一个帖子删了吧。

作者: 泗水亭长 时间: 2012-4-3 23:05
好的。您辛苦了

作者: 泗水亭长 时间: 2012-4-6 10:55
我在公司服务器上确认了，问题ok了。谢谢您了

欢迎光临 FineUI 官方论坛 (https://fineui.com/bbs/)