Apple の脅威の通知と金銭目当てのスパイウェアへの対策について
Apple の脅威の通知と金銭目当てのスパイウェアへの対策についてが公開されました。
Apple の脅威の通知と金銭目当てのスパイウェアへの対策についてが公開されました。
★HTML5タグリファレンス
<input type="search"> …… 検索テキストの入力欄を作成する
http://www.htmq.com/html5/input_type_search.shtml
上記のURLで確認していただくと、わかると思うのですが
Chrome,FireFox,IEなどのブラウザでは<input type="search">
に該当する検索窓をダブルクリックすると、検索履歴のバー
が現れるのですが、Safariではでてきません。
検索履歴のバーを出すようにするには、どのような対応をすれば
良いか、もしくは現状では対応不可なのかが知りたいです。
ご存知の方がいらっしゃいましたら、教えてください。
久しぶりにHTMLいじりました。ソースを見るのは時々やってましたが、書いて試すのは何年振りでしょうか^^;
本題ですが、先の画面はご想像のとおり「戻る」で試したものです。
で、色々試した結果、こんな形になりました。（肝となるところだけ）
# テスト環境：macOS 10.13.3、Safari 11.0.3、Server 5.5（Webサーバをlocalhostに対して起動）
確認した限りでは新規ページで開いても履歴が表示されてます。
<input type="search" tagindex="2" name="qt" autosave="saved-qt" size="31" maxlength="255" autocomplete="on" results="10">
# nameは違いますが、一応「拝啓〜」のものに近づけてます。
実行結果：
ここから"e"を入力した状態：履歴に表示されている範囲以前の検索データであるelevenが候補に上がってます。
以上、ご参考まで。
久しぶりにHTMLいじりました。ソースを見るのは時々やってましたが、書いて試すのは何年振りでしょうか^^;
本題ですが、先の画面はご想像のとおり「戻る」で試したものです。
で、色々試した結果、こんな形になりました。（肝となるところだけ）
# テスト環境：macOS 10.13.3、Safari 11.0.3、Server 5.5（Webサーバをlocalhostに対して起動）
確認した限りでは新規ページで開いても履歴が表示されてます。
<input type="search" tagindex="2" name="qt" autosave="saved-qt" size="31" maxlength="255" autocomplete="on" results="10">
# nameは違いますが、一応「拝啓〜」のものに近づけてます。
実行結果：
ここから"e"を入力した状態：履歴に表示されている範囲以前の検索データであるelevenが候補に上がってます。
以上、ご参考まで。
検索に引っかかったのですが、WebKitの隠し機能(?)として<input type="search" results=5>のようにすると虫眼鏡アイコンのクリックで検索履歴の表示が可能になるようです。
参考サイト：https://css-tricks.com/webkit-html5-search-inputs/
Safari 11.0.3/macOS 10.13.3での例：（他のブラウザとの動作比較はしてません）
希望にあうものか不明ですが、ご参考まで。
このような手順でもダメですか？
1. フォームに検索語句を入力
2. ボタン「サイトのなかを検索」をクリック => Google に飛ぶ
3. Safari > メニューバー > 履歴 > 戻る
4. フォームの虫眼鏡をクリック => 履歴が表示される
当方ではこんな感じになります。
あと、Safari でプライベートブラウズが有効になってると履歴が表示されませんが、その辺はどうでしょうか？
それでダメだとなると私にはちょっと分かりません。ほかの方の回答を待ってください。
いろいろ試してくださりありがとうございます。
<input type="search" tagindex="2" name="qt" autosave="saved-qt" size="31" maxlength="255" autocomplete="on" results="10">
どおりに記述したところ、検索履歴が再現されました。
autocompleteを記述しなくても、resultsだけで履歴バーはでてきたので、autosave
の追記が一番大きいのかもしれません。それにしても、ブラウザ独自の属性がある
とは、今回みなさんに伺うまでは検討もつきませんでした。(そして統一性がないのは
面倒だ。。。)
再現することができ、スッキリしました。ありがとうございます。
勝手に補足。
results 属性については下のリンク先に説明があります。
Safari HTML Reference > Supported Attributes
Safari HTML Reference > Supported Attributes > HTML Attributes > results より
results
Specifies how many results should be returned by the search input type.
Related Tags
input
Support Level
Apple extension
簡単にテストしてみました。(環境が古くてすみません)
Safari 5.1.10
(A) 検索 → 検索結果(別のページ) → 元のページに戻る => 検索履歴が表示される
(B) 検索 → 検索結果(別のページ) → 新規にページを開く => 検索履歴が表示されない
Firefox ESR 45.9.0
(A) 検索 → 検索結果(別のページ) → 元のページに戻る => 検索履歴が表示される
(B) 検索 → 検索結果(別のページ) → 新規にページを開く => 検索履歴が表示される
(B) の挙動が Firefox と Safari では異なるようですね。普段検索履歴は使ってないので知りませんでした。Safari 6 以上については分かりませんが...、ご参考まで。
その手順にそって行い、確認しましたが相変わらず
以下のようです。プライベートブラウズではありません。
また、紹介していただいた手順通りでなくても、
感覚的に使っていても出るのが本来だと思うので、
Safariの不具合(?)のような気もします。
ご親切にありがとうございます。
たしかにそうですね、と返信しようとしたところ
ToMiさんから返信が。
ToMiさんから紹介していただいたコード入力したところ、
表示されました。
推測ですが、ある一定のバージョンからはautosave="saved-qt"
が必要なのかもしれません。
いえいえ、原因を絞るために非常に有益でした。
ご回答ありがとうございます。
先ほど、自身の環境で試してみたのですが、検索履歴のバー
は出てきたのですが、検索履歴は出ない状態でした。
(webkitの記述も該当箇所に追記しました。なんでだろう。。)
Safariはデフォルトでは検索履歴が出ないんですね。
ご回答ありがとうございます。
公式のリファレンスのようなものがあるんですね。
参考になります。
> 検索履歴は出ない状態でした。
ええと、実際に送信しましたか？少なくとも当方の環境 (Mac OS X 10.6.8 / Safari 5.1.10) では履歴が表示されますよ。
試しに↓このページで適当に検索してみてはどうでしょうか？
拝啓 アップル様
Hiro.Sさん
ご自身の環境で試してくださったんですね、ありがとうございます。
紹介してくださったサイトで実際に送信した結果、できませんでした。
虫眼鏡のマークが出てくるんですが、送信後、更新をかけても
「検索履歴はありません」と表示されてしまいます。
ちなみにChrome(バージョン63)では虫眼鏡のマークはないものの、
ダブルクリックすることで検索履歴が出てくることを確認しました。
ToMi さんのところではできてるのに不思議ですね。
あまり役に立てなかったようですみませんでした。
ToMi さん
なるほど。Safari のバージョンにより挙動が異なることが分かり勉強になりました。ありがとうございます。
m3r2y11 さん
履歴が表示されてよかったですね。
Safari11.0のinput type=searchタグ対応について
