Mojave(10.14.6)とSafari(14.0.x)でファイルアップロードする方法

2021/01/17 16:53更新 カテゴリ: Apple,PC周辺機器,その他

(2021/05/29 追記)先日公開された Mojave のセキュリティアップデートと Safari14.1.1 へのアップデートをしたところ、本件の不具合が解消されたことを確認しました。 Mojave と Safari のどちらのアップデートで効いたのか、あるいは両方で効いたのか、については不明です。当ページのテスト用ボタンで動作確認できます。(追記ここまで)

Mojave(10.14.6)でSafari(14.0.x)を使うと「ファイルアップロード」ボタンが効かないという不具合があります。
この画像のようなボタンのことです。

普通はこのボタンを押すと自分のPC内のファイルを指定するためのウィンドウが開きますが、それが開きません。
e-Taxで確定申告をするときに昨年の保存データを読み込もうとして、できないことを知りました。

解決策がわかったので書いておきます。

簡単です。

アップロードしたいファイルを問題のボタンにドラッグ&ドロップする。

だけです。

このように、ボタンを押さなくてもファイル指定ができます。

これは既知の不具合で「Apple サポートコミュニティ」にも情報があります。
しかし最新のsafari(記事執筆時点で14.0.2)でも治っていません。
(safari14.0.xでも10.15 Catalina、11.0 Big Surではこの現象は起きないようです)

webサイト制作側としてできる対処は

input要素にaccept属性を記述する

だけです。
この方法で「作動しないボタン」と「作動するボタン」を作ってみました。

Mojave10.14.6 / safari14.0.xでは作動しないボタン

(input要素にaccept属性記述なし)

Mojave10.14.6 / safari14.0.xでも作動するボタン

(input要素にaccept属性記述あり)

このページのようにaccept属性記述ありとなしが混在している場合、一度でも記述のないボタンを押すと記述のあるボタンも機能しなくなります(safariの再起動で戻ります)。
どのケースでもファイルをドラッグ&ドロップすればいけます。

Sponsored Link