0

複数の Google チャートを含む Web ページがあります。

各グラフの下にボタンを追加したいと思います。

ここに画像の説明を入力

ボタンをクリックすると、同じデータを含むテーブルがその下に表示または非表示になります。

チャート、ボタン、テーブルの表示はうまくいきます。

ID..._chartは 、..._button..._tableです。

ただし、クリック ハンドラーでテーブルを切り替えても機能せず、console.log以下のコードでは常に同じ ID文字列が出力されます。

関数クロージャーの問題だと思いますが、回避方法がわかりません。

ここに私の欠陥のあるコードがあります:

function drawCharts() {
        for (var csv in data) {
                ......skipped some code...

                var chart = new google.visualization.LineChart(document.getElementById(csv + '_chart'));
                chart.draw(t, options);

                var table = new google.visualization.Table(document.getElementById(csv + '_table'));
                table.draw(t, options);

                $('#' + csv + '_table').hide();

                $('#' + csv + '_button').click(function() {
                        console.log('#' + csv + '_table'); // ALWAYS PRINTS SAME
                        $('#' + csv + '_table').toggle();
                });
        }
}

$(function() {
        google.setOnLoadCallback(drawCharts);
});

何か助けてください。

4

1 に答える 1