如何阻止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超鏈接在新選項卡或窗口中打開？

回答

相關問題