#b-navbar { height:0px; display:none; visibility:hidden; }

ページ

2019年10月4日金曜日

aタグのhrefに書いた javascript がうまく動作しない

aタグに javascript: と書いて、スクリプトを実行させるものは
疑似プロトコルと呼ばれ、多用されています。

しかし、ブラウザの特定の環境下(※)では
別窓(新規タブ)が開いてしまうようになり、
スクリプトが動作しません。


■解決する方法の例:
<a href="javascript:sampleFunction();">戻る</a>

<a href="#" onClick="sampleFunction();return false;">戻る</a>

上記のように修正します。
return false;は「#」によるページスクロール抑止のためです。

みなさんも、サイト内のコードをチェックしてみましょう。
エラーではないですが、動作の不具合を起こしやすいですし、
気が付きにくいです。

HTML Lint によると、疑似プロトコルは
Mozilla以外ではサポートされていません。
http://www.htmllint.net/html-lint/explain.html の235番。

今後は、
<a href="#" onClick="sampleFunction();return false;">
で書こうと思います。

-------------
※当方で問題があった環境:
Chromeの最新版 + プラグイン「Opens external links in a new tab1.0