Проблема Javascript с глобальным предупреждением о подтверждении внешней ссылки

StackOverflow https://stackoverflow.com/questions/1053086

Вопрос

Ниже приведен код из плагина для Joomla.Он работает сам по себе, и его цель - обнаруживать внешние ссылки на странице и принудительно вводить их в новые окна браузера с помощью _blank.

Я пытался около часа (я не очень хорошо знаю javascript), но, похоже, не могу понять, как заставить работать функцию onclick.

В конечном результате я хочу добавить к этому скрипту возможность диалогового окна подтверждения, показанного во 2-м разделе кода.

При нажатии на внешнюю ссылку появится диалоговое окно подтверждения, и если в нем будет указано "да", они смогут перейти по внешнему URL-адресу, открывшись в новом окне.В противном случае он отменяется и ничего не делает.

Когда я создаю ссылку с

onclick="return ExitNotice(this.href);"
внутри него это работает отлично, но поскольку на моем веб-сайте есть несколько пользователей, отправляющих свои данные, я бы хотел, чтобы окно подтверждения было глобальным.

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);

Вторая Часть

/* ----------
  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;
}

А) Кто-нибудь может помочь мне решить эту проблему?или Б) Есть ли лучшее решение?

Это было полезно?

Решение

Итак, я кратко изложу то, о чем, по моему мнению, вы спрашиваете, а затем расскажу вам, как, по моему мнению, это можно решить.Возможно, я неправильно понял ваш вопрос.

У вас есть код, который проходит через все теги и устанавливает для их целевого атрибута значение "_blank", а для их имени класса - значение "blank", и вы хотели бы вместо этого переписать ссылки, чтобы использовать JavaScript для отображения диалогового окна подтверждения и перехода к местоположению только в том случае, если пользователь нажмет "Да".

В этом случае, я полагаю, вы хотите, чтобы ссылки заканчивались так, как если бы они были написаны следующим образом:

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

Javascript:void(0) приводит к тому, что обычная обработка браузером клика не приводит к переходу на другую страницу, так что у вашего onclick есть время для выполнения.

Чтобы это произошло, вам нужно изменить определение this.set (внутри this.blankwin) на что-то вроде этого:

  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";
  };

Видишь здесь для получения информации о void(0).

Также обратите внимание, что код, который устанавливает obj.className в "пустой", не очень хорош, потому что он удалит любое другое className, уже назначенное ссылке.Вместо этого вы могли бы просто добавить имя класса к существующим, вот так:

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

Другие советы

Сейчас все работает так, как я хочу.Спасибо вам за вашу помощь.Поскольку это мой первый раз, когда я использую SO, я надеюсь, что зачислил вас правильно.Поскольку я не могу понять, как (или даже возможно ли это) отображать код в полях для комментариев, я решаю ответить на свой собственный вопрос окончательным кодом, чтобы другим было выгодно.

Еще раз, вы показали мне синтаксис, который мне нужно было изменить, чтобы заставить его работать так, как я хотел.

Спасибо!

Окончательный код

    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";
    };

Я еще немного доработал код.Пожалуйста, рассмотрите возможность изменения mfblank.js на следующий контент.Итак, теперь весь Скрипт находится только в одном файле И добавлен дополнительный rel=nofollow .Получайте удовольствие от этого сценария...

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);
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top