2

我不确定如何使用 javascript 在单击外部链接时弹出警告。

我认为在我的外部链接上放一个类也会很方便，但我不太确定它是否像现在这样正确。这是我目前使用的 HTML：

        <div id="commercial-container">
        <a href="http://www.link1.com" class="external" target="_blank"> <img src="picture1.jpg" /> </a>
        <a href="http://www.link2.com" class="external" target="_blank"> <img src="pciture2.jpg" /> </a>
        <a href="http://www.link3.com" class="external" target="_blank"> <img src="picture3.jpg" /> </a>
        <a href="http://www.link4.com" class="external" target="_blank"> <img src="picture4" /> </a>
        </div>

我对 javascript 非常陌生，并且非常不确定如何解决我的问题。到目前为止，我几乎唯一想到的是我将不得不使用 window.onbeforeload 但我不知道如何弄清楚如何编写我需要的函数。

我想将我的 javascript 保存在单独的 .js 文档中，而不是 HTML 中。

4

4 回答 4

3

从 onClick 属性调用 confirm() 函数。如果用户单击确定，则此函数返回 true，这将打开链接，否则返回 false。

<a href="http://www.link1.com" onClick="return confirm('Do you want to leave')" class="external" target="_blank"> <img src="picture1.jpg"/> </a>

希望这可以帮助。

于 2012-11-26T00:20:47.700 回答
1

您可以通过向每个链接添加单击事件处理程序来实现。这样就不必使用类名了。即使用户只是试图关闭您的站点，window.onunload 也会运行，您可能不希望这样做。

   <a href="yourwebsitedomain.com">staying in site</a>
    <a href="two">going external</a>

    <script>
    var a = document.getElementsByTagName('a');
    var b = a.length;

    while(b--){
        a[b].onclick = function(){
            if(this.href.indexOf('yourwebsitedomain.com')<0){
                //They have clicked an external domain
                alert('going external');
            }
            else{
                alert('staying in your site');
            }
        };
    }
    </script>
于 2012-11-26T00:29:10.787 回答
0

如果用户单击图像，div，.. 您需要寻找父节点。! 可能有几个元素用 a-tag 包裹。

document.addEventListener('click',function(event){
    var eT=(event.target||event.srcElement); 

    if((eT.tagName.toLowerCase()==='a' && eT.href.indexOf('<mydomain>')<0)
    || (eT.parentNode!==null && eT.parentNode.tagName.toLowerCase()==='a' 
    && eT.parentNode.href.indexOf('<mydomay>')<0))
    {
    //do someting
    }

    else if(eT...){
      ...
    }
},false);

两个旁注：

  • 如果您想通过 cookie 或类似的方式跟踪用户，最好检查外部链接、设置超时并发出同步获取请求以更新。
  • 最好将事件添加到文档或包含所有事件的 div 并确定目标。
于 2014-08-26T09:25:29.933 回答
0

由于您是 Javascript 新手，我建议您使用 javascript 框架为您完成所有“繁重的工作”。

例如，使用JQuery，您可以通过执行以下操作轻松地将 onClick 事件绑定到所有外部链接：

$(".external").click(function(event) {
   var confirmation = confirmation("Are you sure you want to leave ?");
   if (!confirmation) {
     // prevents the default event for the click
     // which means that in this case it won't follow the link
     event.preventDefault();
   }
 });

这样，每次用户单击与外部类的链接时，都会提示用户确认离开的弹出消息框，并且只有在用户说“是”时才会跟随链接。如果您只想通知而不采取任何操作，您可以通过简单的警报调用替换确认：

$(".external").click(function(event) {
   alert("You are leaving the site");
 });
于 2012-11-26T00:56:55.717 回答