AJAX Call - мерцание больше за каждый клик

Question

Я строю диаграмму (в Yii2 Framework), которая может отображать разные отчеты для каждого периода, мне нужно обновить диаграмму, если пользователь нажимает на группу кнопок с 7D-1M-1Y.

Обновление работает, но каждый раз, когда я меняю период просмотра нажатием кнопки, время мерцания перед отображением правого графика становится больше.

Это мой JS :

if(!$('#7D').hasClass('active') && !$('#1M').hasClass('active') && !$('#1Y').hasClass('active')) { $('#1M').addClass('active'); }
$('#7D').click(function() {
    var myValue = "7D";
    $.get("",{val:myValue},function(data){
        $('.btn').removeClass('active');
        $('#7D').addClass('active');
        $('#w2').fadeOut('fast', function(){
            $('#w2').html(data).fadeIn('fast');
        });
    });
});
$('#1M').click(function() {
    var myValue = "1M";
    $.get("",{val:myValue},function(data){
        $('.btn').removeClass('active');
        $('#1M').addClass('active');
        $('#w2').fadeOut('fast', function(){
            $('#w2').html(data).fadeIn('fast');
        });
    });
});
$('#1Y').click(function() {
    var myValue = "1Y";
    $.get("",{val:myValue},function(data){
        $('.btn').removeClass('active');
        $('#1Y').addClass('active');
        $('#w2').fadeOut('fast', function(){
            $('#w2').html(data).fadeIn('fast');
        });
    });
});

Это моя группа кнопок :

<?= ButtonGroup::widget([
    'buttons' => [
        ['label' => '7D', 'id' => '7D'],
        ['label' => '1M', 'id' => '1M'],
        ['label' => '1Y', 'id' => '1Y'],
    ],
]); ?>

СОВЕТ: Я пробовал использовать тело вместо # w2 (идентификатор диаграммы),и он работает должным образом без увеличения времени мерцания, но мерцание один раз по вертикали, когда диаграмма исчезает, страница переходит наверх, а затем возвращается на новое основание.

Решить это также может быть полезно, мне нужно толькорешение, не важно, как

Answer 1

По вашему вопросу, я полагаю, ваше событие клика было прикреплено к вашему элементу несколько раз.Чтобы не прикреплять их несколько раз, вы можете использовать

$("#SomeId").off("click").on("click", function({
    // Your logic here.
})); 

Хотя проблема в вопросе не ясна.