Как отобразить текст в строке состояния браузера?

Как мы можем изменить текст, отображаемый в строке состояния браузера с помощью JavaScript (или jQuery)?

5 ответов


jQuery не обязательно это делать:

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

однако большинство новых браузеров не позволяют устанавливать текст в строке состояния из JavaScript.


это можно сделать. Поиск Google делает это, что видно при наведении указателя мыши на ссылку Google, в строке состояния отображается базовый сайт:

enter image description here

но когда вы нажимаете на него, он приводит вас к местоположению и 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 м)

enter image description here

выход FireFox: (v42.0)

enter image description here

выход IE: (v11.0.9600.17905 обновление версии 11.0.21 (KB3065822))

enter image description here

выход Opera: (v33.0.1990.58 стабильный)

enter image description here

выход Seamonkey: (v2.38)

enter image description here

выход Avant: (V Ultimate 2015 build 28)

  • IE 11 двигатель:

    enter image description here

  • IE совместимый двигатель:

    enter image description here

  • хром двигатель:

    enter image description here

  • FireFox engine:

    enter image description here

выход Факела: (v42.0.0.10546)

enter image description here

выход Baidu: (v43.19.1000.119)

enter image description here

выход Maxthon: (В4.4.8.1000)

enter image description here


кроме того, нет необходимости использовать # (the идентификатор фрагмента). Браузеры будут рассматривать текст как http://some.message.here./and_more_message_here как действительный url-адрес тоже. Более странные строки могут считаться допустимыми в зависимости от браузера:

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

    (хром, FireFox, IE, SM, Факел, Baidu, Maxthon, Avant IE11, Avant IE Compat, Avant хром, Avant Браузер firefox.)

    (имена перечислены для браузеров с ожидаемым выходом, имена зачеркнуты ("пример") для браузеров без вывода строки состояния, а имена подчеркнуты ("пример") для браузеров с неожиданным выходом/поведением. Протестировано с версиями браузера, такими же, как перечисленные выше.)

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

    (хром, Firefox и в IE, см, Факел, Байду, Макстон, Авант, т. е. 11, Авант т. е. Compat, Avant Chrome, Avant Firefox.)

  3. <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)

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

    (хром, в Firefox, то есть,SM, Факел, Байду, Макстон, Авант, т. е. 11, т. е. совместимости Авант, Авант хром, Avant Firefox)

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

    (Chrome, FireFox, IE, SM, Факел, 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, Факел, Baidu, Новости, Avant IE11, Avant IE Compat,Avant Chrome, Avant Firefox)

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

    (Chrome, FireFox, IE, SM, Факел, Baidu, Maxthon, Avant IE11, Avant IE Compat, Avant Chrome, Avant Firefox)

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

    (хром, в Firefox, IE, SM, Факел, Baidu, Maxthon, Avant IE 11, Avant IE Compat, Avant Chrome,Avant Firefox)

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

    (хром, в Firefox, IE, SM, Факел, Байду, Макстон, Авант, т. е. 11, т. е. совместимости Авант, Авант Хром,Avant Firefox)

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

    (Chrome, FireFox,IE, SM, Факел, Baidu, Maxthon, Avant IE 11, Avant IE Compat, Avant Chrome, Avant Firefox)

  11. <a href="http://test@double@a.b.c.d">

    (Chrome, FireFox,IE, см, Факел, Байду, Макстон, Авант, т. е. 11, Авангарда, т. е. Compat, Avant Chrome, Avant Firefox)

  12. повторите все строки теста выше, с 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) вы делаете это таким же образом, но вам также необходимо адаптировать параметры безопасности браузера, включив функцию: Инструменты-Параметры Интернета-безопасность-пользовательский уровень:

alt text


во-первых, его внешний вид неоднороден во всех браузерах, а во-вторых, эта функциональность отключено в течение длительного времени по умолчанию в большинстве браузеров по соображениям безопасности.

в любом случае, javascript для этого является простым window.status = "my text"


использовать

window.status = "whatever you want"