Desativando o texto da barra de status do navegador

Question

May 06, 2012, 06:21 AM

statusbar javascript suppress cross-browser html5

Desativando o texto da barra de status do navegador

fundo

Navegadores modernos acabam com a barra de status clássica e, em vez disso, desenham uma pequena dica de ferramenta na parte inferior de suas janelas que exibe o alvo do link em foco / foco.

Um exemplo disso (indesejável, no meu caso) comportamento é ilustrado na seguinte imagem:

QuestõesExiste uma maneira portátil de desativar essas dicas?Estou faltando alguma desvantagem óbvia para fazer isso na minha situação particular?Minha tentativa (veja abaixo) é uma maneira razoável de realizar isso?Raciocínio

Eu estou trabalhando em um aplicativo da web de intranet e gostaria de desativar esse comportamento para algumas ações específicas do aplicativo porque, francamente,https://server/# em todos os lugares parece um olho dolorido e é intrusivo, pois em alguns casos, meu aplicativo desenha sua própria barra de status naquele local.

Minha tentativa

Eu não sou um desenvolvedor web por comércio, então meu conhecimento ainda é bastante limitado neste domínio.

Enfim, aqui está minha tentativa com jQuery:

<code><!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Target Tooltip Test</title>
    <style>
      a, span.a {
        color: #F00;
        cursor: pointer;
        text-decoration: none;
      }

      a:hover, span.a:hover {
        color: #00F;
      }

      a:focus, span.a:focus {
        color: #00F;
        outline: 1px dotted;
      }
    </style>
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script>
      $(document).ready(function() {
        patch();
      });

      function patch() {
        $('a').each(function() {
          var $this = $(this).prop('tabindex', 0);

          if($this.prop('href').indexOf('#') == -1 || $this.prop('rel').toLowerCase() == 'external') {
            return;
          }

          var $span = $('<span class="a" tabindex="0"></span>');

          $span.prop('data-href', $this.prop('href'));
          $span.text($this.text());

          $this.replaceWith($span);
        });

        $('a[rel="external"]').click(function() {
          window.open($(this).prop('data-href'));
          return false;
        });

        $('span.a').click(function() {
          location.href = $(this).prop('data-href');
        }).keypress(function(event) {
          if(event.keyCode == 13) {
            location.href = $(event.target).prop('data-href');
          }
        }).focus(function() {
          window.status = ''; // IE9 fix.
        });
      }
    </script>
  </head>
  <body>
    <ol>
      <li><a href="http://google.com" rel="external">External Link</a></li>
      <li><a href="#foo">Action Foo</a></li>
      <li><a href="#bar">Action Bar</a></li>
      <li><a href="#baz">Action Baz</a></li>
      <li><a href="mailto:[email protected]">Email Support</a></li>
    </ol>
  </body>
</html>
</code>

patch() substitui todos os links contendo# (por exemplo, ações específicas de aplicativos no meu caso) com umspan elemento, faz com que todos os links "externos" sejam abertos em uma nova guia / janela e pareçam não violar o tratamento de protocolo personalizado.