jQuery：检测鼠标单击并在新选项卡中打开目标

Posted 2023-05-07

【中文标题】jQuery：检测鼠标单击并在新选项卡中打开目标

【英文标题】：jQuery: Detect Mouse Click and Open Target in New Tab

【发布时间】：2011-11-25 03:39:54

【问题描述】：

我目前正在设计一个简单的论坛应用程序。它主要由 jQuery/AJAX 提供支持，并在同一页面上加载所有内容；但是，我知道有时用户希望在浏览论坛时一次打开多个主题以在新标签中查看它们。

我对此的解决方案是检测何时单击鼠标中键和单击鼠标左键，然后执行不同的操作。我想在单击鼠标左键时在窗口中使用 AJAX 加载目标，否则将其加载到新选项卡中。

我唯一的问题是我不知道如何使用 jQuery 在新选项卡中打开目标位置。显然不允许随意打开新标签，但是有没有办法将这种类型的行为分配给用户生成的操作？

谢谢！

【参考方案1】：

请查看示例代码。它可能会有所帮助

<script type='text/javascript'>
    jQuery(function($)
        $('a').mousedown(function(event) 
            switch (event.which) 
                case 1:
                    //alert('Left mouse button pressed');
                    $(this).attr('target','_self');
                    break;
                case 2:
                    //alert('Middle mouse button pressed');
                    $(this).attr('target','_blank');
                    break;
                case 3:
                    //alert('Right mouse button pressed');
                    $(this).attr('target','_blank');
                    break;
                default:
                    //alert('You have a strange mouse');
                    $(this).attr('target','_self"');
            
        );
    );
</script>

【讨论】：

点击链接时，会不会在动作执行前改变目标属性？

是的，我会在行动前更改属性。

我想当用户点击链接或打开一个新选项卡时。链接隐藏但通过这些方式只能在 IE 上...我该怎么办？

怎么右键选择在新窗口打开？

【参考方案2】：

<a href="some url" target="_newtab">content of the anchor</a>

你可以在javascript中使用

$('#element').mousedown(function(event) 
      if(event.which == 3)  // right click
          window.open('page.html','_newtab');
      
)

【讨论】：

啊我明白了，不知道我可以在 window.open 上设置目标属性。试试这个。谢谢！

【参考方案3】：

您还需要考虑 ctrl-click 和 cmd-click 用于打开新标签页（分别在 windows/linux 和 mac。因此，这将是一个更完整的解决方案：

jQuery.isClickEventRequestingNewTab = function(clickEvent) 
    return clickEvent.metaKey || clickEvent.ctrlKey || clickEvent.which === 2;
;

【参考方案4】：

    $('#element').mousedown(function(event) 
          if(event.which == 3)  // right click
              window.open("newlocation.html","");
          
    );

现场观看http://jsfiddle.net/8CHTm/1/

【讨论】：

@Philip 我添加了一个小提琴。

【参考方案5】：

鼠标中键的默认动作是在新标签页中打开。

您可以将超链接目标属性设置为 _blank 以打开新标签。

<a href="#link" target="_blank">Link</a>

也可以参考这个问题How to distinguish between left and right mouse click with jQuery

【讨论】：

我需要编辑我的问题并使其更清晰。我希望在左键单击时使用 AJAX 加载目标，然后在鼠标中键单击时在新选项卡中打开。

【参考方案6】：

请尝试“_newTab”而不是“_blank”

window.open( URL , "_newtab");