使用按钮</div>在<div>元素之间切换

Question

我有一个特定的目标。

请参阅此页：http://cubancomplex.kodingen.com/test/MM/dashboard1.html

在最右下方，有一个<div>，每侧有两个按钮。 <div>目前包含一张谷歌图表。

目标是让用户能够使用这两个按钮在大约八个城市的图表之间切换。

我不熟悉javascript或jQuery所以我将不胜感激！我该如何实现这个目标呢？

以下是该部分的代码：

<div id="footer">
    <div class="markerNavLeft" title="Prev" id="prevMarker">&lsaquo;</div>
    <div id="markers">
        <div id="chart">
            <div id="auckland_chart_div"></div>
        </div>
    </div>
    <div class="markerNavRight" title="Next" id="nextMarker">&rsaquo;</div>
</div>

Answer 1

根据我的经验，您可以使用2个选项..

1. 您可以将图表放在div id =“chart”中。第一个添加一个类将其标记为选定的一个（例如选中），当然另一个是隐藏的...请为所有图表添加相同的类（例如图表细节）。然后，你可以使用 var temp = $(".selected").next(".chart-detail"); $(".selected").removeClass("selected"); temp.addClass("selected"); 对于上一个按钮，您可以使用.previous功能。

2. 您可以使用ajax（.ajax函数或.load函数）。使用ID标记每个图表，以便知道下一个或上一个图表是什么（在php中）。