ブラウザのステータスバーにテキストを表示する方法は？

Question

JavaScript（またはjQuery）を使用してブラウザーのステータスバーに表示されるテキストを変更するにはどうすればよいですか？

Answer 1

これを行うためにjQueryは必要ありません。

<script>
function writetostatus(input){
    window.status=input
    return true
}
</script>

ただし、ほとんどの新しいブラウザーでは、ステータスバーのテキストをJavaScriptから設定できません。

Answer 2

これは可能です。 Google検索がそれを実行しています。これは、Googleリンクにカーソルを合わせると確認できます。ステータスバーに基になるサイトが表示されます。

それでもクリックすると、場所とユーザーエージェントに依存するURL https://www.google.com.sg/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&ved=0CC8QFjAAahUKEwi4lP-Z4_rIAhVLk5QKHXRLAe8&url=https%3A%2F%2Fwww.example.com%2F&usg=AFQjCNFEbIRqDC65KFpmuak0aXKmnzjKVQ&bvm=bv.106923889,d.dGo のように表示されます。このURLは、https://www.example.comにリダイレクトする前に、Googleのトラッキングを行います。 " preserve log "を使用してNetwork Inspectorを使用すると、これを簡単にテストできます。

彼らはhacky hackを使用していますが、すべてのブラウザで機能します。

トリックは、ステータスバーをHTLMのa hrefのみを使用してほとんどすべてに設定できることを理解することです（CSSもJavaScriptも必要ありません）。必要なのは、ブラウザーのパーサーをだまして、hrefの値が有効なURLであると見なし、それを表示することだけです。

このスニペットを実行してみてください：

<a href="http://.# this is p͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔͕͓͔̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐̑̓̐͜͜͜͜͜͜͜͜͜͜͜͜‌​̴̵̶͕͓͔͕͓͔͕͓͔͕͓͔̖͕͓̖̱̲̳̖̖̖̖̖̖̖͕̑̓̐̑̓̐̑̓̐̑̓̑̒̓̔̐̒̓̔̒̓̔̒̓̔̒̓̔̒̓̔̒̓̔̒̓̔̒̓̔̒̓̔̐̕̚͜͜͜͜͜‌​͓͔̖͕͓͔̖͕͓͔̖͕͓͔̖͕͓͔̖͕͓͔̖̑̓̑̒̓̔̐̑̓̑̒̓̔̐̑̓̑̒̓̔̐̑̓̑̒̓̔̐̑̓̑̒̓̔̐̑̓̑̒̓̔̕̚̕̚̕̚̕̚̕̚̕̚͜͜͜͜͜‌​͕͓͔̖͕͓͔̖̐̑̓̑̒̓̔̐̑̓̓̓̓̓̓̓̑̒̓̔̕̚̕̚͜͜owerful because ━Σ(ﾟДﾟ|||)━ symbols !@)(*#&$^%</even htlm> or lorem ipsum in all scripts Лорем ипсум Lorem存有 ငါ့ရဲ့ဇာတ်မြင့် घरՏուն Дома ലോറെൻ  ഇപ്സം درமுகப்புЛорем ипсумలోלורם איפסוםరెం ఇప్సమ్ მთავარი હોમ לורם איפסוםלורם איפסום Forsíða Loremのイプサム ಮುಖಪುಟ ទំព័រដើម 가 lorem ipsum의 ຫນ້າທໍາອິດ Տուն আর্কাইভ">Hover this link (do not click) and observe the browser's status bar.</a>

Chromeの出力（画像をクリックして最大化）：（v46.0.2490.80 m）

FireFoxの出力：（v42.0）

IEの出力：（v11.0.9600.17905更新バージョン11.0.21（KB3065822））

Operaの出力：（v33.0.1990.58安定）

Seamonkeyの出力：（v2.38）

Avantの出力：（v Ultimate 2015ビルド28）

• IE 11エンジン：

  

• IE互換エンジン：

  

• Chromeエンジン：

  

• FireFoxエンジン：

  

トーチの出力：（v42.0.0.10546）

バイドゥの出力：（v43.19.1000.119）

Maxthonの出力：（v4.4.8.1000）

---

また、#（ フラグメント識別子 ）を使用する必要はありません。ブラウザは、http://some.message.here./and_more_message_hereのようなテキストも有効なURLと見なします。ブラウザーによっては、奇妙な文字列が有効と見なされる場合があります。

1. <a href="http://a.b.c.d/test_symbols_!#$%^&*()[]{};:'&quot;.><,//=+``~">

   （Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox。）

   （名前は期待される出力でブラウザにリストされ、名前はストライクされます（ "例"）ステータスバー出力のないブラウザーの場合、名前に下線が引かれます（" e̲x̲a̲m̲p̲l̲e̲ "）予期しない出力/動作のブラウザーの場合。上記と同じバージョンのブラウザーでテストされています。）

2. <a href="http://a.b.c.d/test some spaces">

   （Chrome、FireFox、I̲E̲、SM、Torch、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、Firefox、Avant Chrome

3. <a href="http://test some . spaces in domain part/a_b_c_d_e">

   （クロム、 FireFox、I̲E̲、 SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲a̲n̲ Avant Firefox）

4. <a href="http://test some . spaces in domain part without slash">

   （クロム、 FireFox、I̲E̲、 SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲a̲n̲ Avant Firefox）

5. <a href="http://test_without_slash_and_dots">

   （Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox））

6. <a href="http://a.b.c:port_with_letters_test">

   （Chrome、 FireFox、 IE、 SM、 松明、 バイドゥ、 マクソン、 Avant IE11、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、 Avant Chrome、 Avant Firefox）

7. <a href="http://http://double.http.test">

   （Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox））

8. <a href="http://test @ with spaces">

   （クロム、 FireFox、 IE、 SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲a̲n̲ Avant Firefox）

9. <a href="http://test:password@ with spaces/">

   （クロム、 FireFox、 IE、 SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲a̲n̲ Avant Firefox）

10. <a href="http:// test : password @with.spaces/">

    （C̲h̲r̲o̲m̲e̲、FireFox、 IE、SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、M̲a̲x̲t̲h̲o̲n̲、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲A̲t̲A̲v̲

11. <a href="http://test@[email protected]">

    （C̲h̲r̲o̲m̲e̲、FireFox、 IE、SM、T̲o̲r̲c̲h̲、B̲a̲i̲d̲u̲、Maxthon、A̲v̲a̲n̲t̲ I̲E̲ ̲1̲1̲、A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、A̲v̲a̲n̲t̲ A̲h̲r̲r̲r̲r̲r̲r̲r̲

12. 上記のすべてのテスト文字列を繰り返し、http://をhttps://、ftp://、about://、chrome://、file://、foobar://などに置き換えます。

ブラウザが文字列を有効なURLと見なさない場合は、ステータスバーが表示されないので正常に失敗するため、害はありません。 （ただし、Avant IEテスト文字列"http://a.b.c:port_with_letters_test"と互換性があるため、いくつかのバグが発生しているように見えます。）

---

ブラウザのステータスバーに目的の文字列を表示させることは、最初のステップにすぎません。 2番目のステップは、ユーザーがリンクをクリックしたときにブラウザーがページをロードしないようにすることです。

これはreturn falseを使用して簡単に実行できます。

<a onclick="return false" href="http://some.message.here./and_more_message_here">this link will not load</a>

または：

<a onclick="return f()" href="http://some.message.here./and_more_message_here">this link will not load</a>
<script>
  function f() {
    return false;
  }
</script>

上記の2つのスニペットは、Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox。

---

最後のステップは、 window.location または window.open を使用してa hrefの動作を模倣することです。インラインで実行できます：（ online test ）

<!doctype html>
<a onclick="location='http://example.org'; return false" href="https://some.message.here./and_more_message_here">same tab</a>
<br><a onclick="window.open('http://example.org'); return false" href="https://some.message.here./and_more_message_here">new tab</a>

またはreturn func()を使用：（ オンラインテスト ）

<!doctype html>
<a onclick="return f1()" href="http://some.message.here./and_more_message_here">same tab 2</a>
<br><a onclick="return f2()" href="http://some.message.here./and_more_message_here">new tab 2</a>
<script>
  function f1() {
    location = 'http://example.org';
    return false;
  }

  function f2() {
    open('http://example.org');
    return false;
  }
</script>

またはsetTimeoutでインライン化：（ online test ）

<!doctype html>
<a onclick="setTimeout(function(){location='http://example.org';},1); return false" href="https://some.message.here./and_more_message_here">same tab 3</a>
<br><a onclick="setTimeout(function(){window.open('http://example.org');},1); return false" href="http://some.message.here./and_more_message_here">new tab 3 (doesn't work on Avant IE11 and Avant IE Compat if this link is HTTP; works if it is HTTPS or FTP)</a> 

またはsetTimeoutでreturn func()を使用：（ online test ）

<!doctype html>
<a onclick="return f1()" href="http://some.message.here./and_more_message_here">same tab 4</a>
<br><a onclick="return f2()" href="http://some.message.here./and_more_message_here">new tab 4 (doesn't work on Avant IE11 and Avant IE Compat if this link is HTTP; works if it is HTTPS or FTP)</a> <!-- hadn't tested this with sourcepage=HTTP. only tested with sourcepage=HTTPS and sourcepage=localwebpage -->
<script>
  function f1() {
    setTimeout(function() {
      location = 'http://example.org';
    }, 1);
    return false;
  }

  function f2() {
    setTimeout(function() {
      open('http://example.org');
    }, 1);
    return false;
  }
</script>

上記の2つのスニペットは、Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11（コードに警告が記載されている）、Avant IE Compat（警告が記載されている）でも動作するようにテストされていますコード内）、Avant Chrome、Avant Firefox。

Answer 3

簡単なメモIE固有：

IE6とそれを含むまであなたができること：

window.status = "Hello, I'm a custom status bar note.";

ただし、IE6（IE7/8でテスト済み）の後同じ方法で行いますが、ブラウザのセキュリティオプションを調整する必要もあります機能をオンにして、次のようにします。ツール-インターネットオプション-セキュリティ-カスタムレベル：

Answer 4

まず、その外観はブラウザ全体で均一ではありません。次に、その機能 無効になっています 長い間 デフォルトでは セキュリティ上の理由からほとんどのブラウザで。

とにかく、それを行うためのJavaScriptは単純ですwindow.status = "my text"