Ajax 在 div 中加载页面内容，但在右键单击时保持“在新选项卡中打开”

Posted 2023-03-30

【中文标题】Ajax 在 div 中加载页面内容，但在右键单击时保持“在新选项卡中打开”

【英文标题】：Ajax load page content in div but keep the "open in new tab" on right click

【发布时间】：2013-10-17 15:31:25

【问题描述】：

我正在开发一个带有 mysql 数据库的新网站，该数据库对不同类别和子类别中的一堆项目进行排序。我创建了一个很酷的脚本，它可以在 div 中动态加载类别的内容（页面内容），而无需重新加载页面。当您加载内容时，它还会更改地址栏中的 url，如果您从该 url 重新加载页面，您将看到正确类别的内容。问题是我想在每个浏览器提供的右键单击上保留“在新选项卡中打开”，但我找不到任何方法，因为内容是从 javascript/ajax 函数加载的。

我以为

<a href="javascript: liveresults('mycategory');">

可以代替

<a onclick="liveresults('mycategory');">

但是“在新标签中打开”不会出现在 Firefox 中，并在 chrome 中提供“关于：空白”页面。在 Firefox 中，如果我按住 CTRL 然后单击，它可以工作，但 url 是“javascript:%20liveresults('mycategory');”我不知道下一步该做什么。

有人知道我应该如何进行吗？也许我应该尝试创建自己的自定义右键菜单，例如http://grooveshark.com/

【问题讨论】：

如果地址栏的url发生变化，直接写<a href='new url' onclick='javascript...'>即可。并根据收到的 url 教您的页面打开所需的类别。

如果我这样做，页面不会重新加载？

否，如果 onclick 中的 javascript 代码返回 false。

这正是我所需要的！！非常感谢！它就像一个魅力！

它工作得很好，但通常，您也可以按住控制按钮并单击以在新选项卡中打开链接，但这不起作用。你有解决它的想法吗？我尝试了类似的方法： if(event.ctrlKey == 1) window.open(url, "_blank"); 但没有办法阻止焦点在新标签上。

【参考方案1】：

试试这个：

function loadContent(event, param) 
    if (!event.ctrlKey) 
        console.log(param)
        return false
     else
        return true


<a
  href='http://google.com'
  onclick='return loadContent(event, "category")'
>Testo</a>

我想，不用解释了。 另外，风格方面，我建议你这样做：

function loadContent(event) 
    if (!event.ctrlKey) 
        console.log(event.target.dataset.category)
        return false
     else
        return true


<a
  href='http://google.com'
  onclick='return loadContent(event)'
  data-category='my_category'
>Testo</a>

它可能不适用于旧的 IE（它有 srcElement 而不是 target），但在我看来看起来更酷。不过没关系。

或者，实际上（也许它太多了=）你可以摆脱双重指定地址：

function loadContent(event) 
    if (!event.ctrlKey) 
        var part_of_url = event.target.href.split('/')[3]
        // maybe some other extraction method, now 'mail'
        console.log(part_of_url)
        return false
     else
        return true


<a
  href='http://google.com/mail/'
  onclick='return loadContent(event)'
>Testo</a>