質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Safari

SafariはAppleのウェブブラウザであり、Mac OS XとiOSのデフォルトのブラウザです。

解決済

Mac版 Safariにてautofocusが効かない

Usurai
usuraipi

総合スコア26

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Safari

SafariはAppleのウェブブラウザであり、Mac OS XとiOSのデフォルトのブラウザです。

1回答

0評価

0クリップ

159閲覧

投稿2022/05/22 17:45

編集2022/05/23 15:30

コード自体の問題ではないかもなのでもしteratail上で不適切でしたらすみません。

Railsアプリ作成中でテキストボックスにautofocusを追加したのですが、Mac版Safariにてフォーカスがページアクセス時に乗らないです。
Chromeでは正常に動作しました。

iOS版Safariでは仕様となっているようなのですが、Mac版に関してそのような情報は見つけられませんでした。
上のリンク↗️ではMac版のSafariにてautofocusが正常に動作しています

HTML

<input type="text" autofocus>

safariのdev too HTMLl出力内容をみても問題なく上記のようにinputタグに問題なく入っていました。

ブラウザ別対応情報

SafariやMac上の設定の問題なのか、なにかSafariに適した書き方をしなければならないのか、Safariのバグなのか判断し切れませんでした。

関連情報や解決方法がありましたらお教えいただきたいです。
よろしくお願いします


追記

Safariのバージョンは最新の15.1です

イメージ説明

イメージ説明
Chromeではアクセス時にフォーカス行きます(dev tool開く際に消えますが)

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

int32_t

2022/05/22 23:05

「<input type="text" autofocus>」だけのHTML文書では問題が再現しないですよね。問題が再現できるHTMLを質問文に含めてください。
Usurai

2022/05/23 04:57

SafariとChromeのデベロッパーツールでHTMLの出力詳細の画像を追加させていただきました。 Railsでhtml.erbからのものですが「<input type="text" autofocus>」単体にしても再現されることも確認していました。出力見る限り余計なものは入っていないように思えるのですが、抜け落ちている点があるのでしょうか?ありがとうございます。
int32_t

2022/05/23 05:25

うちの Safari 15.5 は data:text/html,<input%20type="text"%20autofocus> にアクセスして正常にフォーカスされます。拡張機能とか、何らかのカスタマイズのせいかもしれませんね。
Usurai

2022/05/23 06:17

拡張機能でした!! AD blocker系は怪しいなと思って試しにオフにしてみたんですが、他の拡張機能のせいでした。 大変お手数おかけしました。ありがとうございます!
Usurai

2022/05/23 06:24

Safari最新ではなかったです失礼しました、妹のMacでも試したんですができなかったのでセットアップ上の問題ではないと思い込んでいましたが、妹の方はずっとアップデートしていないなどの問題だったかもしれません。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Safari

SafariはAppleのウェブブラウザであり、Mac OS XとiOSのデフォルトのブラウザです。