aタグにてhref属性の「javascript:void(0);」の代替手段について
aタグにJavaScriptやjQueryでイベントを割り当てたい場合、href属性に「javascript:void(0);」を指定していたが、ソースコードの見た目やリンク部分のマウスオーバー時の表示内容が微妙という点で他の方法に切り替えたい。以下に代替手段をメモ。
代替手段
href属性を付けない
こちらが簡単に対応できそうだけどCSSがうまく当たらない場合があるらしい。
<a>href無し</a>
return false;を指定する
<a href="./" class="dummy_link">href有り</a> <script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js"></script> <script> $(function(){ $(`.dummy_link`).on(`click`, function(){ return false; }); });
所感
buttonタグやinput type="button"に変更できたらいいんだけど、コーディングデータからタグ構成を勝手に変えるというのは色々難しいケースが多い。そのような場合は上記の代替手段で対応したいところ。
関連記事
-
-
ブラウザ上で画像の切り抜き等編集を行う方法(Cropper.js)
あるサイトで画像をアップロードし、その画像に対してブラウザ上で切り抜き等トリミン ...
-
-
円形のプログレスバーをprogressbar.jsで実装する方法
円形のプログレスバーを実装したかった。CSSだったり画像を用いたりする方法もあっ ...
-
-
CodeIgniter4&Bootstrap&jQueryで簡易版お問い合わせページの作成
CodeIgniter4.4.4&Bootstrap&jQuer ...
-
-
JavaScriptでデバッグ時にconsole.log以外のメソッドを利用する方法
JavaScriptでデバッグ時は基本的にconsole.logを使って配列やオ ...
-
-
JavaScriptでCookieを取り扱う「js-cookie」ライブラリの利用方法
「jquery-cookie」プラグイン開発終了に伴い「js-cookie」ライ ...