scroll top 버튼 클릭 후 스크롤 안되는 문제

스크롤 탑 버튼을 클릭 한 뒤 마우스 휠로 스크롤을 내렸을때 스크롤이 되지 않는 문제

-> 확인해보니 클릭이벤트가 반복적으로 발생

html

<a id="btnScrollTop" href="#">
    <img src="/images/header/scroll_top_button.png" alt="맨위로 가기">
</a>

css

.btn-gotop {
    display: none;
    position: fixed;
    bottom: 0;
    right: 0;
    cursor: pointer;
    z-index: 1;
}

//스크롤탑 버튼 에러 나던 코드
let Top = $('#btnScrollTop');
$(window).scroll(function () {
    if ($(window).scrollTop() > 10){
        $('.btn-gotop').fadeIn();
    } else{
        $('.btn-gotop').fadeOut();
    }

    Top.click(function (e) {
        e.preventDefault();
        $('html, body').animate({scrollTop: 0}, 200);
        return false;
    });
});

//스크롤탑 버튼 수정 코드
let Top = $('#btnScrollTop');
$(window).scroll(function () {
    if ($(window).scrollTop() > 10){
        $('.btn-gotop').fadeIn();
    } else{
        $('.btn-gotop').fadeOut();
    }

    Top.bind().unbind()("click", function (e) {
        e.preventDefault();
        $('html, body').animate({scrollTop: 0}, 200);
        return false;
    });
});

바인드 후 언바인드 해주어서 반복적인 클릭이벤트 발생을 차단함