javascriptusability

Novas janelas em Javascript não-obstrusivo

A newsletter dessa semana do SitePoint mostrou uma forma bem interessante de abrir novas janelas com javascript não-obstrusivo e validando XHTML Strict (para quem não sabe, o atributo ‘target' da tag ‘a' não passa na validação).

<a href="http://example.com/" onclick="
    if (confirm('Open this link in a new window?')) {
      open('http://example.com/');
      return false;
    }
">external link</a>

Basicamente, emprega-se o uso de uma caixa de diálogo. Bem simples. Uma alternativa mais sofisticada é criar uma função e ativá-la através do uso de uma classe. Veja:

<a href="http://example.com/" className="ext">external link</a>
<script type="text/javascript">
  var links = document.getElementsByTagName("a");
  for (var i = 0; i < links.length; i++) {
    var link = links[i];
    if (link.className == "ext") {
      link.onclick = clickHandler;
    }
  }
 
  function clickHandler() {
    if (confirm("Open this link in a new window?")) {
      open(this.href);
      return false;
    }
  }
</script>

Interactions

Webmentions

Like this content? Buy me a coffeeor share around:

0 Like

0 Reply & Share