jQuery的标签解决方法加载海军报图不能完全解决问题 [英] loading flot chart in jquery tab workaround doesn't completely fix the issue

问题描述

有已知的问题，在一个jQuery标签，是不是初始的可见标签这里载入海军报图：

there is known issue with loading a flot chart in a jquery tab that is not the initial visible tab here:

这在这里问：
http://osdir.com/ml/jQuery/2009-06/msg02284.html

和使用这一解决方案回答：

and answered with this solution:

 .tabs-hide {
 /*display: none;*/
  position: absolute;
 left: -10000px;
 }

仍存在一些问题，这个解决方案。

there is still some issues with this solution.

让我们说，该海军报图是在标签的名字叫做＃标签-1。 jQuery的标签把这个URL字符串所以这将开始工作，当你加载了，但如果你试图派人在链接的＃标签-1的URL（或URL任何标签名称），图表不会可见。有没有人看到一个解决方案，始终工作在哪里，包括标签可能会在网址也如此。

Lets say that the tab name that the flot chart is on is called #tab-1. jquery tabs put this in the URL string so this will work initially when you load up but if you try to send someone the URL with the #tab-1 (or any tab name in the URL) in the link, the chart will not be visible. has anyone seen a solution that always works including the case where the tab may be in the url as well.

推荐答案

对于我来说，图表直接用＃标签-1 URL访问特定的标签时，而不是在图表选项卡起初并不积极工作。​​

For me, the chart worked when accessing the specific tab directly with the #tab-1 URL but not when the chart tab was not initially active.

我通过包装图表生成调用到标签激活解决了这个问题（1）：

I solved the problem by wrapping the chart generating call into the tab activation (1):

$('#tabs_container').bind('tabsshow', function(event, ui) {
  if (ui.panel.id == "tab-1") {
    $.plot(...)
  }
})

其中，'＃标签容器和选项卡-1 将替换为相应的标识。 'tabsshow 是事件的名称绑定。

where '#tabs-container' and 'tab-1' are replaced with appropriate IDs. 'tabsshow' is the name of the event to bind to.

这个唯一的缺点是该图表是越来越再次绘制的标签显示每次。对我来说，这不是一个大问题，一个可能是由例如绕过它使用一些标志瓦尔调用$ .plot（）只有一次。

The only downside of this is that the chart is getting drawn again every time the tab is shown. For me it's not a big problem and one might circumvent it by e.g. using some flag vars to call $.plot() only once.

（1）：第二前端在<一href=\"http://docs.jquery.com/UI/Tabs#...my_slider.2C_Google_Map.2C_sIFR_etc._not_work_when_placed_in_a_hidden_.28inactive.29_tab.3F\"相对=nofollow>的jQuery的UI文档

这篇关于jQuery的标签解决方法加载海军报图不能完全解决问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！