如何阻止fancybox超链接在新选项卡或窗口中打开？

我有一个关于Fancybox的严重问题。我有一个图片库的网站。如果图像上有任何滥用数据，用户可以报告图像。如何阻止fancybox超链接在新选项卡或窗口中打开？

目前我正在使用Fancybox显示报表。我使用jQuery验证输入字段并使用AJAX提交数据，并且脚本位于父页面上。

<a href="linktothereportform?id=5" class="report fancybox.ajax" rel="nofollow" style="color:#CC0033;">report</a>

这完美的作品。但是，如果用户在新选项卡或新窗口中打开链接，则会出现问题，因为验证脚本不在报表上。这些在父页面上。

那么有什么方法可以停止右键单击或单击鼠标滚动或我将如何克服这个问题？

感谢

来源

2013-03-22 vinu

你能一个div或按钮元素上使用onclick事件，并通过函数调用手动调用的fancybox？ – Scuzzy 2013-03-22 03:54:12

@Scuzzy对不起朋友，我没有得到你。 – vinu 2013-03-22 03:55:21

由于fancybox通过ajax请求表单，您可以检查'$ _SERVER ['HTTP_X_REQUESTED_WITH']'变量以查看页面是否通过ajax请求，并且如果不阻止它显示表单。 – Jeemusu 2013-03-22 03:59:05

另一种选择是捕获所有鼠标按键（左，右和滚轮）点击过当选择.report和触发的fancybox如果有的话，如：

$(document).ready(function() { 
    $(".report").on('mousedown', function (e) { 
     if (e.which == 1 || e.which == 3 || e.which == 2) { 
      e.preventDefault(); 
      $(this).fancybox({ 
       // API options 
      }).click(); 
     } 
     return false; 
    }); 
    $(document).on('contextmenu', function (e) { 
     e.preventDefault(); 
    }); 
});

请参阅JSFIDDLE并在缩略图上尝试任何鼠标按钮。

注意：.on()需要的jQuery 1.7+

来源

2013-03-22 06:36:13 JFK

Ahaaaa很棒.. :)）即使对于我Fancybox图片..谢谢。 – vinu 2013-03-22 06:53:02

你可以通过一个div或input.button元素

<input type="button" value="click here" class="fake-fancy" data-href="linktothereportform?id=5"> 

<span class="fake-fancy" data-href="linktothereportform?id=5">Report</span> 

<script type="text/javascript"> 
    jQuery('.fake-fancy').click(function(){ 
    jQuery.fancybox.open({ 
     href: jQuery(this).attr('data-href'), 
     type: 'ajax' 
    }); 
    }); 
</script>

来源

2013-03-22 03:56:40 Scuzzy

感谢朋友，我得到了你说的，我会更新你。谢谢 – vinu 2013-03-22 04:06:11

你实际上可以做'jQuery（this）.data（'href'）'而不是'jQuery（this）.attr（'data-href'）' – JFK 2013-03-22 06:44:23

@JFK整洁，我不知道那个函数是否存在。 – Scuzzy 2013-03-24 22:04:09

您可以将无效点击右键，并通过与按钮替换所有这样的链接中间点击选项上的函数调用调用的fancybox。

即

$('a.report').replaceWith('<button onclick="window.location.href=\'linktothereportform?id=5\'">report</button>');

您可能需要调整了一下上面，加上风格的按钮看起来像链接等，但总的想法是让“开放式-同一窗口”功能同时排除所有“新窗口”的可能性。

来源

2013-03-22 03:57:26 techfoobar

好了，有了这个想法。至于你的回答，这对动态身份证是如何可能的？ – vinu 2013-03-22 04:01:33

jQuery（'a.report'）。each（function（）{jQuery（this）.replaceWith（''）;}）; – Scuzzy 2013-03-22 04:13:45

所有的功劳都应该给那些为我的问题提供正确有价值答案的人。

我决定为将来寻求这个问题的答案的人作出很好的回答。

我基本上将我的答案分为两部分。

至于我的原始问题，我需要一个超链接解决方案。

因此第一种方法是超链接

正如@ Jeemusu的评论。

Fancybox使用AJAX加载内容。有一个名为HTTP_X_REQUESTED_WITH的HTTP变量集，如果它是AJAX请求，它将被设置并设置为'xmlhttprequest'。

因此，即使有人打开新选项卡中的链接，我们可以检查它是否是AJAX或non-AJAX并根据此显示内容。所以不用担心右键单击。

<?php 
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') { 
//this is an ajax request. do what you need to 
} 
else { 
    //this is non ajax. do what you need 
} 
?>

第二个选项是将超链接更改为按钮或任何div。

一般的想法是获得'open-in-same-window'功能，同时排除所有'open-in-new-window'的可能性。

正如@ Scuzzy的和@ techfoobar的答案

<input type="button" value="click here" class="fake-fancy" data-href="linktothereportform?id=5"> 

<span class="fake-fancy" data-href="linktothereportform?id=5">Report</span> 

<script type="text/javascript"> 
    jQuery('.fake-fancy').click(function(){ 
    jQuery.fancybox.open({ 
     href: jQuery(this).attr('data-href'), 
     type: 'ajax' 
    }); 
    }); 
</script>

jQuery('a.report').each(function(){jQuery(this).replaceWith('<button onclick="window.location.href=\'' + jQuery(this).attr('href') + '\'">report</button>');});

来源

2013-03-22 04:56:37 vinu

@ Scuzzy，Jeemusu，techfoobar感谢您的回答，因为您所有的答案都是正确的我upvoted所有的答案和未来的目的我从你给出的答案作出了完整的答案。所以所有的学分都会发给你。谢谢 – vinu 2013-03-22 04:59:39

你可以用'jQuery（this）.data（'href'）''替换'jQuery（this）.attr（'data-href'）'' – JFK 2013-03-22 06:42:56

您可以替换link由button这不会让用户打开，在新标签。你可以这样说：

<button onclick="window.location='linktothereportform?id=5';" class="report fancybox.ajax" style="color:#CC0033;">report</button>

来源

2013-03-22 05:03:24

如何阻止fancybox超链接在新选项卡或窗口中打开？

回答

相关问题