僅當用戶需要時，JavaScript窗口位置新選項卡

我有一些代碼JavaScript（jQuery）代碼正在運行，用於偵聽<a href="">點擊並將其替換爲數據屬性中的鏈接。僅當用戶需要時，JavaScript窗口位置新選項卡

<a class="js-external" href="http://www.google.com/" data-href="/tracking.php?url=http://www.google.com/">Google</a> 
<script type="text/javascript"> 
    $('a.js-external').click(function(e) { 
     var hrefNew = $(this).attr('data-href'); 

     if (hrefNew) { 
      e.preventDefault(); 
      window.location.href = hrefNew; 
     } 

    }); 
</script>

這按預期工作，但打破了一些瀏覽器行爲。如果用戶ctrl + click的鏈接（在新窗口中打開它），該URL仍然會在同一窗口中打開。

我該如何不打破常規瀏覽器？我是否也應該檢測用戶是否按住ctrl，然後使用window.open()？

來源

2016-11-30 DenverCoder9

'如果（e.ctrlKey）window.open（...）'？ –

是的，我可以做到這一點。但我也必須爲mac添加'metaKey'，並且可能還會增加一些邊緣情況。沒有更好的方法嗎？ – DenverCoder9

它發生，因爲你是防止默認動作與 e.preventDefault();

使你在你的問題中提到你必須跟蹤壓制在新窗口中的控制鍵和開放。

if(e.ctrlKey) 
    window.open(hrefNew) 
    else 
    window.location.href = hrefNew;

但是，如果你不希望這樣做那麼最簡單的方法是動態地設置的錨的href屬性。

$('a.js-external').click(function(e) { 
    var hrefNew = $(this).attr('data-href'); 
    if (hrefNew) { 
     $(this).attr("href",hrefNew); 
    } 
});

https://jsfiddle.net/tintucraju/go44o3o3/

來源

2016-11-30 10:46:57

謝謝！替換實際的href值似乎效果最好。檢測'ctrlKey'是不夠的，因爲還有鼠標中鍵，'metaKey'等等。我認爲只有它沒有檢測到的點擊是鼠標右鍵 - >在新標籤中打開。 – DenverCoder9

僅當用戶需要時，JavaScript窗口位置新選項卡

回答

相關問題