Webサイトのボタンやaタグがクリックできなかった時の対処法とその原因を解説
突然Webサイトのボタン（aタグ）がクリックできなくなったら
Webサイト制作をしていると、突然リンクやボタン、aタグがクリックできなくなる問題に直面することがあります。
この原因は様々ですが、今回は突然リンクやボタン、aタグがクリックできなくなった時の対処法を解説していきます。
タグの閉じ忘れ
Webサイトのリンクが正常に機能しなくなった場合、HTMLの構造が乱れているのが問題になっているかもしれません。
たとえば、下記のコードのように、２つ目のaタグが閉じられていないことにより、それより後に記述されたaタグに悪影響を与えることもあります。
<ul>
<li><a href="#">リスト１</a></li>
<li><a href="#">リスト２</li>
<li><a href="#">リスト３</a></li>
<li><a href="#">リスト４</a></li>
</ul>タグの閉じ忘れの影響がどのように出るかは一概には言えないものの、閉じ忘れによってaタグが機能しなくなることもあります。
こうしたタグの閉じ忘れについては、W3Cが提供するThe W3C Markup Validation Serviceでチェックすることができるので、活用してください。
z-indexの設定
CSSが原因でリンクが突然クリックできなくなることもあります。
よくあるエラーが、z-indexを低く設定していたため、aタグが反応しなくなってしまうというものです。
通常であればz-indexの値が低くても、問題なくクリックできるのですが、他の要素との兼ね合いによってクリックできなくなることがあります。
そのため、もしクリックできないリンクやボタンがあった場合は、その要素に影響しているCSSを確認し、z-indexに問題がないかを確認してみましょう。
JavaScriptの影響
JavaScript（JS）が影響してリンクがクリックできなくなることも、よくある話です。
リンクのaタグの親タグに対して何かしらのJSの処理が施されているため、そのJSの処理が優先されてしまったり、他の部分で使われているclass名と同じものを使っていたため、意図せずJSが影響してしまったりすることがあります。
リンクがクリックできない問題がJSの影響かどうかを確認する最も有効な方法は、一度コメントアウトなどでJSファイルを読み込まないように設定し、リンクの状況を確認することです。
もしJSファイルを読み込まない状態でリンクが正常に機能すれば、問題はJSファイルである可能性が高いです。
その場合は、JSの内容を見返し、問題箇所に対して何か影響を与えていないかを確認していきましょう。
iPhone・iPadの場合
iPhoneやiPadでSafariを使っている場合、ポップアップブロックが影響してクリックができないという現象が発生することがあります。
これはiPhone・iPadのポップアップブロックがJSのwindow.open()で開こうとしているリンクを悪質なサイトとみなすことがあり、それにより正常にリンクが開かれないということがあります。
この問題の対処法としてはlocation.href()を使う、clickイベントを使うというものがあります。
このiPhone・iPadのSafariの問題に関しては、下記の記事で詳しく解説していますので、ご参照ください。