Pregunta

A continuación se muestra el código de un complemento para Joomla. Funciona por sí mismo y su propósito es detectar enlaces externos en la página y forzarlos a nuevas ventanas del navegador usando _blank.

Lo he intentado durante aproximadamente una hora (no conozco bien JavaScript) pero parece que no puedo entender cómo hacer que funcione una función onclick.

Resultado final, quiero agregar a este script la capacidad de un diálogo de confirmación, que se muestra en la sección del segundo código.

Cuando se hace clic en un enlace externo, aparecerá el cuadro de diálogo de confirmación, y si dice que sí, podrán acceder a la URL externa, abriéndose en una nueva ventana. De lo contrario, se cancela y no hace nada.

Cuando creo un enlace con

onclick="return ExitNotice(this.href);"
funciona perfectamente, pero como mi sitio web tiene varias personas enviando información, me gustaría que el cuadro de confirmación sea global.

this.blankwin = function(){
  var hostname = window.location.hostname;
  hostname = hostname.replace("www.","").toLowerCase();
  var a = document.getElementsByTagName("a");   
  this.check = function(obj){
    var href = obj.href.toLowerCase();
    return (href.indexOf("http://")!=-1 && href.indexOf(hostname)==-1) ? true : false;              
  };
  this.set = function(obj){
    obj.target = "_blank";
    obj.className = "blank";
  };    
  for (var i=0;i<a.length;i++){
    if(check(a[i])) set(a[i]);
  };        
};

this.addEvent = function(obj,type,fn){
  if(obj.attachEvent){
    obj['e'+type+fn] = fn;
    obj[type+fn] = function(){obj['e'+type+fn](window.event );}
    obj.attachEvent('on'+type, obj[type+fn]);
  } else {
    obj.addEventListener(type,fn,false);
  };
};
addEvent(window,"load",blankwin);

Segunda parte

/* ----------
  OnClick External Link Notice
---------- */
function ExitNotice(link,site,ltext) {
  if(confirm("-----------------------------------------------------------------------\n\n" + 
    "You're leaving the HelpingTeens.org website. HelpingTeens.org\ndoes not " + 
    "control this site and its privacy policies may differ\nfrom our own. " + 
    "Thank you for using our site.\n\nYou will now access the following link:\n"  + 
    "\n" + link + "\n\nPress \'OK\' to proceed, or  press \'Cancel\' to remain here." + 
    "\n\n-----------------------------------------------------------------------")) 
  {
  return true;
} 
history.go(0);
return false;
}

A) ¿Alguien puede ayudarme a solucionar este problema? o B) ¿Hay una mejor solución?

¿Fue útil?

Solución

Entonces, resumiré lo que creo que estás preguntando y luego te diré cómo creo que eso se puede resolver. Es posible que haya entendido mal su pregunta.

Tiene un código que pasa por todas las etiquetas y establece su atributo de destino en " _blank " y establece su className en " en blanco " ;, y le gustaría reescribir los enlaces para usar JavaScript para mostrar un diálogo de confirmación y solo ir a la ubicación si el usuario hace clic en Sí.

En este caso, creo que desea que los enlaces terminen como si estuvieran escritos así:

<a href="javascript:void(0)" onclick="if (ExitNotice('http://www.whatever.com')) window.location.assign('http://www.whatever.com')">

El javascript: void (0) hace que el manejo normal del navegador del clic no vaya a otra página, de modo que su onclick tenga tiempo de ejecutarse.

Para que esto suceda, querrás cambiar la definición de this.set (dentro de this.blankwin) a algo como esto:

  this.set = function(obj){
    var href = obj.href;
    obj.href = "javascript:void(0)";
    obj.onclick = function() { (if ExitNotice(href) window.location.assign(href); };
    obj.target = "_blank";
    obj.className = "blank";
  };

Consulte aquí para obtener información sobre void (0).

Además, tenga en cuenta que el código que establece obj.className en " blank " no es genial, porque eliminará cualquier otro className ya asignado al enlace. En su lugar, podría simplemente agregar el nombre de la clase a los existentes, así:

obj.className = obj.className + " blank";

Otros consejos

Todo funciona como lo quiero ahora. Gracias por tu ayuda. Como es la primera vez que uso SO, espero haberte acreditado correctamente. Como no puedo entender cómo (o incluso si es posible) mostrar el código en los cuadros de comentarios, elijo responder mi propia pregunta con el código final para que otros se beneficien.

Una vez más, me mostró la sintaxis que necesitaba modificar para que funcionara como quería.

¡GRACIAS!

Código final

    this.set = function(obj){
            var href = obj.href;
            //obj.href = "javascript:void(0)";
            obj.onclick = function() { return ExitNotice(href)};
            obj.target = "_blank";
            obj.className = obj.className + " blank";
    };

Refiné el código un poco más. Considere cambiar el archivo mfblank.js por el siguiente contenido. Así que ahora, todo el Script está en un solo archivo Y se agrega un rel = nofollow adicional. Diviértete con este script ...

this.blankwin = function(){
  var hostname = window.location.hostname;
  hostname = hostname.replace("www.","").toLowerCase();
  var a = document.getElementsByTagName("a");   
  this.check = function(obj){
    var href = obj.href.toLowerCase();
    return (href.indexOf("http://")!=-1 && href.indexOf(hostname)==-1) ? true : false;              
  };  
  this.set = function(obj){
            var href = obj.href;
            obj.onclick = function(){ if(confirm("Do you wanne leave this page?")) {
              return true;
            } 
              history.go(0);
              return false;
            };
            obj.target = "_blank";
            obj.className = obj.className + " blank";
            obj.rel = "nofollow";
    };
    for (var i=0;i<a.length;i++){
        if(check(a[i])) set(a[i]);
    };      
  }; 
  this.addEvent = function(obj,type,fn){
        if(obj.attachEvent){
            obj['e'+type+fn] = fn;
            obj[type+fn] = function(){obj['e'+type+fn](window.event );}
            obj.attachEvent('on'+type, obj[type+fn]);
        } else {
            obj.addEventListener(type,fn,false);
        };
    };
    addEvent(window,"load",blankwin);
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top