MS IME のちょっとだけ変なムーブに立ち向かわない
報告された不具合
input[type=number]
にフォーカスすると直接入力モードになるが、その後input[type=text]
のフィールドにフォーカスを移しても、元の入力モードに戻らない
例えば日本語入力モードで input[type=text]
で入力したあとで、 input[type=number]
にフォーカスを移すと数値が入力されるように直接入力に切り替わります。これは正常な動きであり、どの環境でもそうなります。しかしそのあとで input[type=text]
にフォーカスを移動した場合に、他の環境では日本語入力モードに戻るのですが、MS IMEではそうならず、直接入力モードのままです。
この挙動が間違っていることを示す情報は見つけられていませんが、圧倒的マイノリティである現実から、とりあえずこの挙動は間違いであることにしようと思います。
Webページ上でのIMEの切り替えについて
<input />
要素でIMEを切り替える方法は、いくつかあるようです。
type attribute
inputの属性のなかで最もよく知られている type
属性です。 type=text
の場合は日本語入力モードに切り替えることができますが、 type=number
type=email
などにすると直接入力に固定することができます。
<input type="number" />
しかしながら、逆はありません。日本語入力モードに固定することはできません。
cf) <input>: 入力欄(フォーム入力)要素 - HTML: ハイパーテキストマークアップ言語 | MDN
inputmode attribute
inputmode
属性は、スマートフォンなどの仮想キーボードの表示を切り替えるための属性だそうです。これを inputmode=numeric
や inputmode=email
などとしてやると、PC上ではIMEが直接入力モードになります。
<input inputmode="numeric" />
しかしながら、やはり逆はありません。日本語入力モードに固定できる値はありません。 inputmode=text
はユーザーに日本語入力モードへの切り替えを許可するだけで、勝手に切り替えたりはできません。そもそもIMEを制御するための機能ではありませんから。
cf) inputmode - HTML: ハイパーテキストマークアップ言語 | MDN
ime-mode CSS Property
かつてはスタイルシートで ime-mode
を指定することで制御できる環境があったそうです。IEっていうんですけど。しかし限られたブラウザでしか動作しないので全く実用的ではありません。
ime-mode
は3大「スタイル関係ないCSSプロパティ」のひとつと言われています。(自分調べ)
<input style="ime-mode: active" />
そして残念ながら、いずれの方法でも日本語入力モードに明示的に切り替えることはできません。
そもそもできるべきでない?
多くのユーザーは操作しているアプリケーションにコントロールを奪われることを嫌います。スクロールジャックだったり、予期せぬモーダルウィンドウなどが例にあがりますが、UIはユーザーの自由な操作を尊重すべきという考えがあります。IMEについても同様で、JSなどから好き勝手に入力モードの切り替えをされたらユーザーはストレスを感じることでしょう。
やるべきでないことは、できるべきでない。
一旦の結論
ひょっとしたらものすごく強引で泥臭い形でハックできるのかもしれませんが、仕様で出来るようになっていないわけですから、フロントエンドでがんばってなんとかする領域ではないと考えました。
Discussion