停用浏览器状态栏文字 [英] Disabling browser status bar text

查看:143
本文介绍了停用浏览器状态栏文字的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

现代浏览器不使用经典状态栏,而是在窗口底部绘制一个小工具提示,在悬停/焦点上显示链接目标。

Modern browsers do away with the classic status bar and instead draw a small tooltip at the bottom of their windows that displays the link target on hover/focus.

下面的截图说明了这种情况的一个例子(在我的例子中是不受欢迎的):

An example of this (undesirable, in my case) behavior is illustrated in the following screenshot:

img src =https://i.stack.imgur.com/OQW5C.pngalt =http://i.imgur.com/0dAxc.png>


  1. 是否有可移除的方式停用这些工具提示? >
  2. 我在这种情况下缺少任何明显的缺点?

  3. 我的尝试是否是一种合理的方式? >
  1. Is there a portable way to disable these tooltips?
  2. Am I missing any obvious drawbacks to doing this in my particular situation?
  3. Is my attempt (see below) a reasonable way of accomplishing this?






推理



在一个intranet web应用程序,并希望禁用此行为某些应用程序特定的操作,因为坦率地说, https:// server /#到处都看起来像一个眼睛,因为在某些情况下我的应用程序在该位置绘制自己的状态栏。


Reasoning

I am working on an intranet web application and would like to disable this behavior for some application-specific actions because quite frankly, https://server/# everywhere looks like an eye-sore and is obtrusive since in some instances my application draws its own status bar in that location.

我不是一个网络开发者,所以我的知识在这个领域还是有限的。

I'm not a web-developer by trade, so my knowledge is still rather limited in this domain.

我尝试用jQuery:

Anyway, here's my attempt with jQuery:

<!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:support@example.org">Email Support</a></li>
    </ol>
  </body>
</html>

patch()使用 span 元素,使所有外部链接都打开的方式,使用code>#新的标签页/窗口,似乎不会破坏自定义协议处理。

patch() replaces all links containing # (i.e., application-specific actions in my case) with a span element, makes all "external" links open in a new tab/window and doesn't seem to break custom protocol handling.

推荐答案


Is there a portable way to disable these tooltips?

除了上述示例之外的变通方法。

Nope, other than workarounds like your example above.


我在这种情况下缺少任何明显的缺点吗?

Am I missing any obvious drawbacks to doing this in my particular situation?

你似乎缺少一个事实,整个情况是尴尬的。为什么有链接,如果你要让他们看起来像按钮?只需使用按钮。对于这个问题,为什么要麻烦与链接,如果你最终切换他们与跨越?只需使用范围。

You seem to be missing the fact that the whole situation is awkward. Why have links at all if you're going to make them look like buttons? Just use buttons. For that matter, why bother with links if you end up switching them out with spans anyway? Just use spans.


我的尝试是否是一种合理的方法?

Is my attempt (see below) a reasonable way of accomplishing this?

作为一般的方法并不真正合理,因为你从文档中删除这些锚点元素,所以任何附加的事件监听器,expandos等都将丢失。它可能适用于您的具体情况,但更为合理的方法是不首先使用链接(见上文)。

It's not really reasonable as a general approach, because you're removing those anchor elements from the document, so any attached event listeners, expandos, etc. will be lost. It may work for your specific situation, but a more sane approach would be to not use links in the first place (see above).

如果你仍然决心这样做,至少不替换 a 元素。只要摆脱它的 href 属性,并设置一个事件监听器,就像你在你的例子。现在它不再是一个链接,所以它不会显示在状态栏(但它仍然是相同的元素,至少)。

If you're still determined to do something like this, at least don't replace the a element. Just get rid of its href attribute and set up an event listener as you did in your example. Now it's no longer a link, so it won't show up in the status bar (but it's still the same element, at least).

这篇关于停用浏览器状态栏文字的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆