Al validar uno de mis scripts con el W3C Validator y siguiendo el estándar estricto (Strict) se me presento el problema de que en mis enlaces utilizaba la etiqueta target=”_blank” para que determinados enlaces se abrieran en otra página y no en la misma. Como por ejemplo:

1

<a href="http://undominio.com" target="_blank">enlace</a>

Pero este atributo no era válido para el estándar estricto. Aunque una alternativa podría ser poner el estándar como transicional (Transitional) y conseguir que se validara, prefería cumplirlo a raja tabla con Strict y darle al coco.

Después de googlear un poco encontré un enlace interesante en EsLoMas.com donde se hablaba a lo largo y tendido de como solucionarlo a través de dos funciones de javascript (una más eficiente que la otra) y que simplemente se aplicarían poniendo a un enlace class=”external” (o otro nombre de clase que predefiniéramos).

Por ejemplo así:

1

<a href="http://undominio.com" class="external">enlace</a>

Me gusto la manera de solucionarlo, aunque al utilizar Mootools creía que podría integrarlo en la página y a la vez acortar un poco más el script y con suerte ganar algo de eficiencia gracias a la librería.

Pues bien, el script original ofrecido por la página de EsLoMas.com (la versión más eficiente era la siguiente:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

   function prepareTargetBlank(){
   var className = 'external';
   var as = document.getElementsByTagName('a');
   for(i=0;i<as .length;i++){
      var a = as[i];
      r=new RegExp("(^| )"+className+"($| )");
      if(r.test(a.className)){
         a.onclick = function(){
            window.open(this.href);
            return false;
         }
      }
    }
}
 
window.onload = prepareTargetBlank;

Yo propongo la siguiente solución con Mootools 1.2.1 (seguramente es mejorable, comentarios son bienvenidos):

1
2
3
4
5
6
7
8
9
10
11

    window.addEvent('domready',function()
    {
        $$('a.external').each(function(el)
        {
            el.addEvent('click',function(ev)
            {
                new Event(ev).stop();
                window.open(el.href)
            })
        })
    })

Mi solución esta basada en los selectores de Mootools $$ que recogen la etiqueta a (anchor) y para cada una (each) asocio un evento click (onClick) y paro dicho evento para asociar una nueva ventana al la locación donde apunte el enlace (href).

Para los talibanes del código que quieren que el script pese menos ahorrando líneas de código pueden dejarla en una sola línea de código (aunque se ofusca bastante para luego releer el código en un futuro):

1

    window.addEvent('domready',function(){$$('a.external').each(function(el){el.addEvent('click',function(ev){new Event(ev).stop();window.open(el.href)})})})

Si optáis por esta última versión, os recomiendo guardar un archivo nombre.js y otro nombre_edit.js con la anterior, con el fin, de que podáis tener la versión menos compacta más a mano por si queréis retocarla y para cuando la pongáis en vuestros sitios poner la versión de una línea.