Javascript 选择另一个模式弹出窗口后，带选项卡的模式弹出窗口中的JQuery flot不会出现

将Visual Studio 2012与JQuery、引导和Flot一起使用

我的屏幕显示多个项目。选择某个项目时，会出现一个带有选项卡的模式弹出窗口，其中第一个选项卡上包含一个Flot图。（实际上有一个getJSON调用来获取图形数据，因此图形在填充选项卡之后才会显示）

当选择一个唯一的项目时，这一切都可以正常工作。但是，单击以前选择的项目时，Flot图不会显示

这是Flot的HTML格式：

<div id="rightside-@Model.Room.RoomId" class="rightside">
  <div id="placeholder-@Model.Room.RoomId-container"  style="width:460px;height:300px;margin-bottom:28px">
    <div id="placeholder-@Model.Room.RoomId" style="width:460px;height:250px;margin-bottom:20px"></div>
    <input type="text" name="from" class="input-medium" value="#startDate"  />
    to
    <input type="text" name="to" class="input-medium" value="#endDate"/>
    <input type="button" class="btn" data-function="refine-date" data-value="change_graph_dattes" value="Change dates" style="float:right"/>
  </div>
<div>

到

在单步执行代码时，我在$.plot语句之前设置了一个断点，我看到绘图空间（占位符nn）、其父容器（占位符nn容器）和其上的容器（右侧nn）的高度、宽度、左侧、右侧、底部和顶部均为0。但是，选项卡的其余部分和容器中的元素（输入）显示正确

---

有什么建议吗？

在进一步调试之后，我发现在图表试图绘制选项卡中的div时，没有大小，但选项卡本身有大小。因此我推断这与标签激活有关

为了让它发挥作用，我必须：

禁用第一个选项卡的自动激活

在短时间延迟（1/10秒）后通过javascript激活选项卡

这项声明不起作用：

$('#tabs a:first').tab('show');

这样做确实有效：

setTimeout(function () { $('#tabs a:first').tab('show'); }, 100);

---

在从一个选项卡切换到另一个选项卡时是否会发生这种情况？通常，当这些组件从隐藏变为可见时，您需要重新初始化或强制重新绘制它们。

选择唯一项时，这一切都可以正常工作。但是，当单击以前选择的项目时，Flot图不会出现。

-这是什么意思？你能创建一个小提琴的例子吗？从一个标签切换到另一个标签效果很好。当模态窗口隐藏然后返回时，div没有任何位置信息。cvrebert--我想我正在尝试重新绘制组件。但是，他们没有位置信息，所以flot不会重新绘制。我花了一点力气复制了你的情况，但失败了：（一切似乎都正常）。您需要复制它以获得进一步帮助。