チェックボックスにチェックされたときだけ、aタグのボタンをクリック可能にする方法を教えてください。

Question

前提・実現したいこと

利用規約が全てスクロールされた時だけ、その下にある「同意する」というチェックボックスにチェックできるようになっています。

そのチェックボックスにチェックを入れた時だけ、お申し込みボタンを押せるようにし、
チェックボックスにチェックがない通常時はお申し込みボタンを半透明にしたいです。

発生している問題・エラーメッセージ

エラーメッセージ

<div class="pp_box">
  <h3>利用規約</h3>
  <div class="scr">
    <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
    </p>
  </div>
</div>
<div class="form_checkbox">
<input id="check" type="checkbox" name="is_agree" disabled>&nbsp;「利用規約」 に同意する
</div>

<script>
  let scr = document.getElementsByClassName('scr');
scr[0].onscroll = (event) => {
  if (event.target.clientHeight + event.target.scrollTop === event.target.scrollHeight) {
    document.getElementById('check').disabled = false;
  }       
}
</script>
<div class="btn1"><a href="#"><img src="images/btn1.png" alt="月払い" /></a></div>
<div class="btn2"><a href="#"><img src="images/btn2.png" alt="年払い" /></a></div>

試したこと

ググりながらjsを色々試したのですが、知識が少なすぎてわかりませんでした。

補足情報（FW/ツールのバージョンなど）

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

たとえば

<a href="#" onclick="return check.checked">・・・</a>

Comments

[koshijun]

コメントありがとうございます。
下記のようにaタグ部分を変えたのですが、最初からボタンが押せる状態となっており、特に変化が見られません・・
<div class="btn1"><a href="#" onclick="return check.checked"><img src="images/btn1.png" alt="月払い" /></a></div>
<div class="btn2"><a href="#" onclick="return check.checked"><img src="images/btn2.png" alt="年払い" /></a></div>

[yambejp]

いや普通にクリックしてもページ遷移しないですね

<input id="check" type="checkbox" name="is_agree">
<div class="btn1"><a href="#" onclick="return check.checked">test</a></div>