Javascript小僧：デジタル時計（IE11対応）：崖の上のジョージ：So-netブログ

	ブログをはじめるログイン

Javascript小僧：デジタル時計（IE11対応）　[コンピューター] [編集]

Javascript小僧：デジタル時計（まとめ）
http://cheese999.blog.so-net.ne.jp/2014-01-13

を持って、「デジタル時計」のネタは終わるはずだったのですが。。。

期せずして、マイクロソフト社がネタを提供してくれました。
会社のPCでは問題なく動作していたコードが、家のPCでは正常に動作しない。
Firefox, Chromeでは動作するのですが、IEでは動作しない。

ネットで調べた限りでは、IE10からIE11にver upしたときに動作が変わって
しまったようです。

if( /*@cc_on ! @*/ false ){} というif文でブラウザがIEかどうか判定していた
のですが、IE11がIEと判定されていないようでした。そこで、ユーザーエージェント名
を使用してブラウザを判定することにしました。

var myUA = navigator.userAgent.toLowerCase();
if(myUA.match(/msie/i)){}

最初、上記のコードを使って試しましたが、IE11をIEと認識できませんでした。
ネットで調べたところ、IE11のユーザーエージェント名には「msie」という文字列は
含まれておらず、その代わりに「trident」という文字が含まれているとのことです。

var myUA = navigator.userAgent.toLowerCase();
if(myUA.match(/msie/i) || myUA.match(/trident/i)){}

そこで、上記のように「trident」、「msie」のどちらかが含まれていたら、IEと
判定するようにしました。

デジタル時計のHTMLがロードされたとき、12h/24h切替ラジオボタンを24hに切り替える
処理が入っており、IEの場合、24hのボタンを

myEmt1.fireEvent("onclick");

というコードを使ってクリックしていたのですが、IE11ではダメみたいで、

// イベントオブジェクトを作成
var event = document.createEvent( "MouseEvents" );
// イベントの内容を設定
event.initEvent("click", false, true);
// イベントを発火させる
myEmt1.dispatchEvent(event);

のコードだと、うまくいきました。どちらのコードを使ってクリックするか判定させる
条件は、if( /*@cc_on ! @*/ false ){} を使用しました。これで正しいかは不明です。

if( /*@cc_on ! @*/ false ){} のif文についてネットで調べたところ、Javascriptの
条件付きコンパイルというものらしいです。

http://d.hatena.ne.jp/chalcedony_htn/touch/searchdiary?word=*[JavaScript]&of=10

通常、Javascriptで/* */の中はコメントとして
解釈され、無視されます。ただし、cc_onと書いてある場合、IEでは有効となるようです。

http://msdn.microsoft.com/ja-jp/library/ie/121hztk3%28v=vs.94%29.aspx

if( /*@cc_on ! @*/ false ){} のif文は、
IEではif(! false){} と解釈され、条件が真(true)となるため、{}の中が実行されます。
IE以外では、if(false){} と解釈され、条件が偽(false)となるため、{}の中が実行されません。
ですが、IE11では条件が偽となってしまうようです。IE11のユーザーエージェント名には
「like Gecko」の文字があるし。。。 Firefoxみたいですね。

http://msdn.microsoft.com/ja-jp/library/ie/bg182625%28v=vs.85%29.aspx

上記の考え方に基づいたデジタル時計のコードは次の記事に掲載します。