JavaScript (または jQuery) を使用して、ブラウザーのステータス バーに表示されるテキストを変更するにはどうすればよいでしょうか?
6 に答える
これは可能です。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 は、にリダイレクトする前に、Google の追跡などを行いますhttps://www.example.com
。これは Network Inspector で「 preserve log 」を使用して簡単にテストできます。
彼らはハックハックを使用していますが、すべてのブラウザーで機能します。
秘訣は、HTLM のみを使用してa href
(CSS も JavaScript も必要としない) ステータス バーをほとんど何でも設定できることを理解することです。必要なのは、値が有効な URL であるとブラウザのパーサーに認識させhref
、それを表示することだけです。
このスニペットを実行してみてください:
<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 Update Versions 11.0.21 (KB3065822))
Opera の出力: (v33.0.1990.58 安定版)
Seamonkey の出力: (v2.38)
Avant の出力: (v Ultimate 2015 build 28)
トーチの出力: (v42.0.0.10546)
Baidu の出力: (v43.19.1000.119)
Maxthon の出力: (v4.4.8.1000)
#
また、 (フラグメント識別子)を使用する必要はありません。ブラウザは、テキストのような http://some.message.here./and_more_message_here
ものも有効な URL と見なします。ブラウザによっては、より奇妙な文字列が有効と見なされる場合があります。
<a href="http://a.b.c.d/test_symbols_!#$%^&*()[]{};:'".><,//=+``~">
(Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox。)
(名前は、予想される出力を伴うブラウザーに対してリストされ、名前は、ステータス バー出力を伴わないブラウザーに対して打ち消されます ("
例")、予期しない出力/動作を伴うブラウザーに対しては、名前に下線が引かれます ("e̲x̲a̲m̲p̲l̲e̲")。上に挙げたもの。)<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̲t Chrome、Av̲ant)
<a href="http://test some . spaces in domain part/a_b_c_d_e">
(c̲h̲r̲o̲m̲e̲、
firefox、i̲e̲、sm、t̲o ̲r̲c̲h̲、b̲a̲i̲d̲u̲、m̲a̲x̲t̲hh̲o̲n̲、a̲v̲ 、ab̲n<a href="http://test some . spaces in domain part without slash">
(c̲h̲r̲o̲m̲e̲、
firefox、i̲e̲、sm、t̲o ̲r̲c̲h̲、b̲a̲i̲d̲u̲、m̲a̲x̲t̲hh̲o̲n̲、a̲v̲ 、ab̲n<a href="http://test_without_slash_and_dots">
(Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox)
<a href="http://a.b.c:port_with_letters_test">
(
Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11 、 A̲v̲a̲n̲t̲ I̲E̲ ̲C̲o̲m̲p̲a̲t̲、Avant Chrome、Avant Firefox)<a href="http://http://double.http.test">
(Chrome、FireFox、IE、SM、Torch、Baidu、Maxthon、Avant IE11、Avant IE Compat、Avant Chrome、Avant Firefox)
<a href="http://test @ with spaces">
(c̲h̲r̲o̲m̲e̲、
firefox、ie、sm、 t̲o̲r̲c̲h̲ 、b̲a̲i̲d̲u̲ 、m̲a̲t̲h̲h̲o̲n̲、a̲v̲n̲t̲i<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̲t̲h̲h̲o̲n̲、a̲v̲n̲t̲i<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̲t̲h̲h̲o̲n̲、a̲v̲n̲t̲ i<a href="http://test@double@a.b.c.d">
(c̲h̲r̲o̲m̲e̲、firefox、 ie、sm、t̲o̲r̲c̲h̲、b̲a̲i̲d̲u̲、
maxthon、a̲v̲a̲a̲n̲t̲ie̲1̲1̲1̲1̲1̲、 、、、、などに
http://
置き換えてhttps://
、上記のすべてのテスト文字列を繰り返します。ftp://
about://
chrome://
file://
foobar://
ブラウザーが文字列を有効な URL と見なさない場合、ステータス バーを表示しないことで正常に失敗することがわかります。したがって、害はありません。(ただし、Avant IE Compat で test string を使用すると、いくつかのバグが発生しているように見えます"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>
または: (オンライン テスト)return func()
で使用setTimeout
<!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 でも動作することがテストされています。ファイアフォックス。
これを行うために jQuery は必要ありません。
<script>
function writetostatus(input){
window.status=input
return true
}
</script>
ただし、ほとんどの新しいブラウザでは、JavaScript からステータス バーのテキストを設定できません。
IEに固有の簡単なメモに関係する可能性のある人:
IE6まで、それを含めると次のことができます。
window.status = "Hello, I'm a custom status bar note.";
ただし、IE6(IE7 / 8でテスト済み)の後も同じ方法で実行しますが、次の機能をオンにしてブラウザのセキュリティオプションを調整する必要もあります。ツール-インターネットオプション-セキュリティ-カスタムレベル:
まず第一に、その外観はブラウザー全体で統一されておらず、第二に、セキュリティ上の理由から、ほとんどのブラウザーでデフォルトでその機能が長い間無効になっています.
とにかく、それを行うためのJavaScriptは簡単ですwindow.status = "my text"
10 年前の質問への回答です。アイデアがリンク先を非表示にすることであった場合。私はこの機能を使用します
<script>
function go2(hell){ window.location=hell; }
</script>
and the links will be like this :
<a href="#" onclick="go2('www.somewhere.net/page.html')">my link</a>
使用する
window.status = "whatever you want"