IE7下弹出窗口出现滚动条时Alert出现JS错误

泗水亭长 · 发表于 2012-3-30 16:37:58

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

〓飚〓 · 发表于 2012-3-30 16:43:27

贴出代码嘛，暂时没遇到过这样的问题

泗水亭长 · 发表于 2012-3-30 16:47:21

<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:50

没出错呀~~

泗水亭长 · 发表于 2012-3-30 17:06:48

IE6 IE9 没问题，IE7有问题，很多网友都已经测试确认了这个问题了

sanshi · 发表于 2012-3-30 17:52:31

这是泗水亭长给我的测试例子：

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

sanshi · 发表于 2012-3-30 17:56:42

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

打开extjs源代码，定位到如下片段：

调试后发现，在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:01

@泗水亭长，方便把你们项目放点截图到《基于 ExtAspNet 的项目展示区》。。。

泗水亭长 · 发表于 2012-3-30 19:20:48

好的，我想请问一个问题：
我之前调试虽然也定位到了出错的地方，但为什么我看到的JS代码显示为一行，没有任何格式，可读性非常不好。为什么您截图的出错代码页面是有格式的呢？

30372245 · 发表于 2012-3-30 19:51:10

我找extjs的没压缩源代码调试，不过一般不需要这样，extjs本身出现bug的情况还比较少

		自动登录	找回密码
密码			立即注册

IE7下弹出窗口出现滚动条时Alert出现JS错误

本帖子中包含更多资源

本帖子中包含更多资源