改变散列但不移动使用jquery ui选项卡的页面 [英] Changing the hash but not moving the page using jquery ui tabs

问题描述

我添加了以下代码来将哈希值更改为标签名称：

  $（＃tabs> ul ）.tabs（{
 select：function（event，ui）{
 window.location.hash = ui.tab.hash; 
} 
}）; 
  

这在FF3中正常工作，但在IE7中它向下移动页面（取决于从

我尝试将其更改为：

  $（＃tabs> ul）。tabs（）; 
 $（＃tabs> ul）。bind（tabsshow，function（event，ui）{
 window.location = ui.tab.hash; 
}）
  

这会在IE7和FF3中导致相同的行为，这会将页面向下移动到所选标签的顶部。

我希望标签被更改，散列被更新，但页面根本没有移动，这是我在第一个例子中如何在FF3中工作的，但不在IE7中。

谢谢。

注意：JQuery 1.3.1 / JQuery-UI 1.6rc6

解决方案

如果页面上有一个与您设置哈希值相同的id，例如您'试图将浏览器哈希设置为#cars并且页面上已经存在div＃汽车，浏览器会将您滚动到该div的位置。

要我的知识，有3种可能的解决方法

1）将浏览器哈希更改为其他内容，如#thecars。

2）以某种类似的方式更改现有的标记。

3）在某些事件中，更改id你的类似命名的标记，然后改变浏览器散列，然后将标记的名称重新转换为它的原始值，理论上也应该工作。这显然是一个糟糕和缓慢的解决方法，只是想我会提到它。

I added the following code to change the hash to the tab name:

$("#tabs > ul").tabs({ 
select: function(event, ui){ 
window.location.hash = ui.tab.hash; 
} 
} );

This works fine in FF3 but in IE7 it moves down the page (depending on the tab selected anywhere from somewhere near the top of the page all the way down to the very end of the page).

I tried changing it to:

$("#tabs > ul").tabs();
$("#tabs > ul").bind("tabsshow", function(event, ui) {
window.location = ui.tab.hash;
})

This leads to identical behavior in both IE7 and FF3, which moves the page down to the top of the selected tab.

I would like the tab to be changed, the hash to be updated, but the page not moved at all, which is how it works in FF3 in my first example, but not in IE7.

Thanks.

Notes: JQuery 1.3.1 / JQuery-UI 1.6rc6

解决方案

If there's an element on the page that has the same id as what you're setting the hash to, for instance you're trying to set the browser hash to #cars and there's already a div#cars on the page, the browser will scroll you down to where that div is.

To my knowledge, there are 3 possible workarounds

1) Change the browser hash to something else such as #thecars.

2) Change your existing markup in some similar manner.

3) On some event, changing the id of your similarly named markup, then changing the browser hash, then rechanging the name of markup back to it's original value should also theoretically work. This is obviously a bad and slow workaround, just thought I'd mention it.

这篇关于改变散列但不移动使用jquery ui选项卡的页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！