Как отобразить текст в строке состояния браузера?
Как мы можем изменить текст, отображаемый в строке состояния браузера с помощью JavaScript (или jQuery)?
5 ответов
jQuery не обязательно это делать:
<script>
function writetostatus(input){
window.status=input
return true
}
</script>
однако большинство новых браузеров не позволяют устанавливать текст в строке состояния из JavaScript.
это можно сделать. Поиск 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 с "сохранить журнал".
они используют hacky hack но он работает во всех браузерах.
хитрость заключается в том, чтобы понять, что мы можем установить строку состояния почти на все, используя только HTLM a href
(не требуется CSS или JavaScript). Все, что нам нужно, это обмануть анализатор браузера, думая, что href
value является допустимым 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 м)
выход FireFox: (v42.0)
выход IE: (v11.0.9600.17905 обновление версии 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: (В4.4.8.1000)
кроме того, нет необходимости использовать #
(the идентификатор фрагмента). Браузеры будут рассматривать текст как http://some.message.here./and_more_message_here
как действительный url-адрес тоже. Более странные строки могут считаться допустимыми в зависимости от браузера:
-
<a href="http://a.b.c.d/test_symbols_!#$%^&*()[]{};:'".><,//=+``~">
(хром, FireFox, IE, SM, Факел, Baidu, Maxthon, Avant IE11, Avant IE Compat, Avant хром, Avant Браузер firefox.)
(имена перечислены для браузеров с ожидаемым выходом, имена зачеркнуты ("
пример") для браузеров без вывода строки состояния, а имена подчеркнуты ("пример") для браузеров с неожиданным выходом/поведением. Протестировано с версиями браузера, такими же, как перечисленные выше.) -
<a href="http://a.b.c.d/test some spaces">
(хром, Firefox и в IE, см, Факел, Байду, Макстон, Авант, т. е. 11, Авант т. е. Compat, Avant Chrome, Avant Firefox.)
-
<a href="http://test some . spaces in domain part/a_b_c_d_e">
(хром,
в Firefox, то есть,SM, Факел, Baidu, Maxthon, Avant IE 11, Avant IE Compat, Avant Chrome,Avant Firefox) -
<a href="http://test some . spaces in domain part without slash">
(хром,
в Firefox, то есть,SM, Факел, Байду, Макстон, Авант, т. е. 11, т. е. совместимости Авант, Авант хром,Avant Firefox) -
<a href="http://test_without_slash_and_dots">
(Chrome, FireFox, IE, SM, Факел, 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,Факел,Baidu,Новости,Avant IE11, Avant IE Compat,Avant Chrome,Avant Firefox) -
<a href="http://http://double.http.test">
(Chrome, FireFox, IE, SM, Факел, Baidu, Maxthon, Avant IE11, Avant IE Compat, Avant Chrome, Avant Firefox)
-
<a href="http://test @ with spaces">
(хром,
в Firefox,IE,SM, Факел, Baidu, Maxthon, Avant IE 11, Avant IE Compat, Avant Chrome,Avant Firefox) -
<a href="http://test:password@ with spaces/">
(хром,
в Firefox,IE,SM, Факел, Байду, Макстон, Авант, т. е. 11, т. е. совместимости Авант, Авант Хром,Avant Firefox) -
<a href="http:// test : password @with.spaces/">
(Chrome, FireFox,
IE, SM, Факел, Baidu, Maxthon, Avant IE 11, Avant IE Compat, Avant Chrome, Avant Firefox) -
<a href="http://test@double@a.b.c.d">
(Chrome, FireFox,
IE, см, Факел, Байду, Макстон, Авант, т. е. 11, Авангарда, т. е. Compat, Avant Chrome, Avant Firefox) повторите все строки теста выше, с
http://
заменить наhttps://
,ftp://
,about://
,chrome://
,file://
,foobar://
и т. д.
мы видим, что если браузер не считает строку допустимым url-адресом, она не будет отображаться без строки состояния, поэтому никакого вреда не будет. (За исключением того, что похоже, что некоторые ошибки происходят для Avant IE Compat с помощью тестовой строки "http://a.b.c:port_with_letters_test"
.)
получение строки состояния браузера для отображения желаемой строки-это только первый шаг. Второй шаг-остановить загрузку страницы браузером, когда пользователь нажимает на ссылку.
это можно легко сделать с помощью 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>
выше двух фрагментов протестированы для работы на Chrome, FireFox, IE, SM, Torch, Байду, Макстон, Авант ИЕ11, т. е. совместимости Авант, Авант хром, Авант браузер Firefox.
последний шаг-использовать window.location
или window.open
имитировать поведение a href
. Это можно сделать inline: (онлайн-тест)
<!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>
или inline с setTimeout
: (онлайн-тест)
<!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>
выше два фрагмента также протестированы для работы на Chrome, FireFox, IE, SM, Torch, Baidu, Maxthon, Avant IE11 (с оговоркой, указанной в коде), Avant IE Compat (с оговоркой, указанной в коде), Avant Chrome, Avant Firefox.
кому это может касаться простого Примечания специфический для IE:
до IE6 и включая его вы могли бы сделать:
window.status = "Hello, I'm a custom status bar note.";
но после IE6 (протестировано IE7/8) вы делаете это таким же образом, но вам также необходимо адаптировать параметры безопасности браузера, включив функцию: Инструменты-Параметры Интернета-безопасность-пользовательский уровень:
во-первых, его внешний вид неоднороден во всех браузерах, а во-вторых, эта функциональность отключено в течение длительного времени по умолчанию в большинстве браузеров по соображениям безопасности.
в любом случае, javascript для этого является простым window.status = "my text"