运行AJAX的选择奇怪的IE8问题

时间:2022-11-24 13:40:36

I've got a strange error with IE8 and postcode lookups. It may not be postcode lookups as such that's causing it - just an AJAX call that modifies a select. I've set up a test page here. If you click on Find Address, and then double click (quite quickly) on one of the addresses that is within the boundary of the red-bordered div, you see the below bug in IE8.

IE8和邮政编码查找有一个奇怪的错误。它可能不是导致它的邮政编码查找 - 只是一个修改选择的AJAX调用。我在这里设置了一个测试页面。如果单击“查找地址”,然后双击(非常快速)在红色边框div边界内的某个地址上,则会在IE8中看到以下错误。

Note: I'm finding it inconsistent to reproduce the bug, but if you scroll the list of addresses right to the bottom and then double click fast on Holly Cottage it should reproduce the bug.

注意:我发现重现错误是不一致的,但是如果你将地址列表向右滚动到底部,然后在Holly Cottage上快速双击它应该重现该错误。

运行AJAX的选择奇怪的IE8问题

If anyone can shed on light on this quirky behaviour it'd be much appreciated. Is this an IE8 bug?

如果有人能够阐明这种古怪的行为,那就非常感激了。这是IE8的错误吗?

3 个解决方案

#1


2  

I've found the problem - browsers do not like having javascript:void() set for the href attribute. If you want to have a working anchor whose default action is canceled, then use # for the href attribute, then have the event handler for that anchor return false to cancel the browser's default action.

我发现了问题 - 浏览器不喜欢为href属性设置javascript:void()。如果您想要一个默认操作被取消的工作锚,那么使用#作为href属性,然后让该锚的事件处理程序返回false以取消浏览器的默认操作。


Erm... right... sorry for my eagerness to post an answer and not double check that the problem was properly solved.

呃...对...抱歉我急于发布答案而不是仔细检查问题是否得到了妥善解决。

I'm finding it difficult to find the problem. I'm only going to hazard a guess here: the two effects running and ending at the same time confuses IE8, causing the div to be set to a height of 1px. This of course assumes a bug in the jQuery implementation of the effect queue, which I definitely cannot vouch for. It's just my theory at the moment - my unfamiliarity with IE developer toolbar prevents me from investigating further.

我发现很难找到问题所在。我只想冒这个猜测:同时运行和结束的两个效果混淆IE8,导致div被设置为1px的高度。这当然假设效果队列的jQuery实现中存在一个错误,我绝对不能保证。这只是我的理论 - 我对IE开发人员工具栏的不熟悉使我无法进一步调查。

#2


1  

It's a problem with You running animations I suppose. Your asynchronous action triggers some sliding animations.

我想你运行动画是一个问题。您的异步操作会触发一些滑动动画。

First: Try logging endings of all animations (put a callback function in the slide* call and log some text to console.) to see if they run in correct order - I suppose they don't and that's the problem.

首先:尝试记录所有动画的结尾(在slide *调用中放置一个回调函数并将一些文本记录到控制台。)以查看它们是否以正确的顺序运行 - 我认为它们没有,这就是问题所在。

Second: Try adding .stop() before every asynchronously triggered animation so that it breaks other animations working at the same time.

第二:尝试在每个异步触发的动画之前添加.stop(),以便它同时破坏其他动画。

Third: If the above didn't help try this for every animation:

第三:如果上面没有帮助尝试每个动画:

if($(this).data('running')==0){
$(this).data('running',1).slideUp(function(){$(this).data('running',0)});
}else{ /*call with timeout or ignore...*/ }

It's a basic semaphore on an element.

它是元素的基本信号量。

OR

要么

You can use .animate and animation queues in jQuery properly, but it'd be a bit of an overkill for this case (I think).

你可以在jQuery中正确使用.animate和动画队列,但对于这种情况来说这有点过分(我认为)。

#3


0  

My first reaction is it may be a CSS issue. If I find the default value, and click the 'Find Address' link one time, I see a similar (though not identical) layout problem. The height on each section looks collapsed, as if the floating sections aren't picking up the correct content height. If I incrementally specify a height on each contentRow or switch the display from block-none-block on pcodeLookupAddressEdit_risk_address, the formatting is corrected.

我的第一反应是它可能是一个CSS问题。如果我找到默认值,并单击“查找地址”链接一次,我会看到类似(但不完全相同)的布局问题。每个部分的高度看起来都是折叠的,就像浮动部分没有拾取正确的内容高度一样。如果我在每个contentRow上逐步指定高度或在pcodeLookupAddressEdit_risk_address上从block-none-block切换显示,则格式化将得到纠正。

I don't know the specific cause, but, you may want to check the CSS and the show/hide behavior on the slide.

我不知道具体原因,但是,您可能想要检查幻灯片上的CSS和显示/隐藏行为。

#1


2  

I've found the problem - browsers do not like having javascript:void() set for the href attribute. If you want to have a working anchor whose default action is canceled, then use # for the href attribute, then have the event handler for that anchor return false to cancel the browser's default action.

我发现了问题 - 浏览器不喜欢为href属性设置javascript:void()。如果您想要一个默认操作被取消的工作锚,那么使用#作为href属性,然后让该锚的事件处理程序返回false以取消浏览器的默认操作。


Erm... right... sorry for my eagerness to post an answer and not double check that the problem was properly solved.

呃...对...抱歉我急于发布答案而不是仔细检查问题是否得到了妥善解决。

I'm finding it difficult to find the problem. I'm only going to hazard a guess here: the two effects running and ending at the same time confuses IE8, causing the div to be set to a height of 1px. This of course assumes a bug in the jQuery implementation of the effect queue, which I definitely cannot vouch for. It's just my theory at the moment - my unfamiliarity with IE developer toolbar prevents me from investigating further.

我发现很难找到问题所在。我只想冒这个猜测:同时运行和结束的两个效果混淆IE8,导致div被设置为1px的高度。这当然假设效果队列的jQuery实现中存在一个错误,我绝对不能保证。这只是我的理论 - 我对IE开发人员工具栏的不熟悉使我无法进一步调查。

#2


1  

It's a problem with You running animations I suppose. Your asynchronous action triggers some sliding animations.

我想你运行动画是一个问题。您的异步操作会触发一些滑动动画。

First: Try logging endings of all animations (put a callback function in the slide* call and log some text to console.) to see if they run in correct order - I suppose they don't and that's the problem.

首先:尝试记录所有动画的结尾(在slide *调用中放置一个回调函数并将一些文本记录到控制台。)以查看它们是否以正确的顺序运行 - 我认为它们没有,这就是问题所在。

Second: Try adding .stop() before every asynchronously triggered animation so that it breaks other animations working at the same time.

第二:尝试在每个异步触发的动画之前添加.stop(),以便它同时破坏其他动画。

Third: If the above didn't help try this for every animation:

第三:如果上面没有帮助尝试每个动画:

if($(this).data('running')==0){
$(this).data('running',1).slideUp(function(){$(this).data('running',0)});
}else{ /*call with timeout or ignore...*/ }

It's a basic semaphore on an element.

它是元素的基本信号量。

OR

要么

You can use .animate and animation queues in jQuery properly, but it'd be a bit of an overkill for this case (I think).

你可以在jQuery中正确使用.animate和动画队列,但对于这种情况来说这有点过分(我认为)。

#3


0  

My first reaction is it may be a CSS issue. If I find the default value, and click the 'Find Address' link one time, I see a similar (though not identical) layout problem. The height on each section looks collapsed, as if the floating sections aren't picking up the correct content height. If I incrementally specify a height on each contentRow or switch the display from block-none-block on pcodeLookupAddressEdit_risk_address, the formatting is corrected.

我的第一反应是它可能是一个CSS问题。如果我找到默认值,并单击“查找地址”链接一次,我会看到类似(但不完全相同)的布局问题。每个部分的高度看起来都是折叠的,就像浮动部分没有拾取正确的内容高度一样。如果我在每个contentRow上逐步指定高度或在pcodeLookupAddressEdit_risk_address上从block-none-block切换显示,则格式化将得到纠正。

I don't know the specific cause, but, you may want to check the CSS and the show/hide behavior on the slide.

我不知道具体原因,但是,您可能想要检查幻灯片上的CSS和显示/隐藏行为。