18
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

MS-IMEとHTML5のinput[type=xxx]

Last updated at Posted at 2014-08-03

HTML5で追加された様々なinputのtype属性値。
その値によってフォームの見た目が変わるっていうのはよく知られていることだが、いつからかIMEにも影響を与えるようになっていた模様。

#IMEがオフになる
具体的にいうと、type属性値が number, tel, email, url の時に、IMEがオフになるというもの。

ただし、どういう環境でもということではなく、以下の環境でのみIMEの変化を確認。

OS:Win7 or 8
ブラウザ:IE11、Chrome、Firefox
IME:MS-IME

確認用HTML

通常この手のものはブラウザのみが対象になると思うが、どうやらブラウザとIMEの組み合わせで起こっている模様。
手元で確認した限りだと、WinでもMacでもGoogle日本語入力では起こらなかったし、Macのことえりでも起こらなかった。
MS-IMEのみが該当のブラウザで該当のtype属性値の場合にのみIMEをオフにする模様。

ちなみに、IMEがオフになると書いたが、無効になるわけではないので、日本語入力に切り替えることは可能。

##IME(Input Method Editor)制御
入力フォームにフォーカスした際に、ひらがなモード・半角英数モードどちらをデフォルトのモードとするかやソフトウェアキーボードのレイアウトをどうするかといった制御のこと。

###PC向けの対応
PC向けサイトのフォーム要素でIMEを制御しようとする際は、IEが独自に実装(Firefoxもver.3から対応)したCSSのime-modeプロパティを使ってオン・オフ・無効などを切り替えていた。

###スマートフォン向けの対応
スマートフォンやタブレットでは表示されるソフトウェアキーボードのレイアウトを目的にあったものに切り替えられるということで、これまでもinputのtype属性を切り替えていた。

18
17
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
18
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?