Question

我有这样的问题：我有链接，点击打开当前页面顶部的模态对话框中的ajaxFormDialog。但是，当我单击中间按钮时，它会在新选项卡中打开，并且所有内容都不在模态窗口中，但当前在新标签页上看起来很糟糕。所以，我的问题是，如何禁用当前链接的鼠标中键？

<a class="ajaxFormDialog" ...></a>
<script>
    $(function (){
       $('a.ajaxFormDialog').live("click", function(e) {
           $.ajax({
                type: "POST",
                url: $("#formContent form").attr("action"),
                data: $("#formContent form").serialize(),
                success: function(data) {
                            //... do something
                         }
                 });
       });
</script>

UPD 我使用了你建议的

if(e.which == 2) {
   e.preventDefault();
}

它可能会阻止默认，但仍会打开包含该表单的新选项卡。当我点击链接上的中间/鼠标滚轮按钮时，它甚至没有显示我，他输入了这个$（function（）{$（'a.ajaxFormDialog'）。on（“click”，function（e）{..

UPD2 我写了这样的代码：

$(function (){
   $('a.ajaxFormDialog').live("click", function(e) {
       console.log("Which button is clicked: " + e.which);
       if(e.which == 2) {
          e.preventDefault();
       }
       // rest of the code...

所以当我点击鼠标左键时，控制台会显示“点击了哪个按钮：1”，但是当我点击中/鼠标滚轮按钮时它没有显示任何内容，仍然会在新标签页中打开。

Answer 1

$("a.ajaxFormDialog").on('click', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
   }
});

Answer 2

<强>已更新：

在Firefox中无法禁用鼠标中键的默认功能。如上所述here。

Firefox和其他Gecko浏览器已发布鼠标右键控件，但无法禁用中间点击的默认操作。您可以通过编辑“about：config”URL上的middlemouse设置来更改默认操作，但Javascript无法取消它们。

您可以找到帖子here的类似链接。

一些现代浏览器（如Chrome）中非常接近的工作解决方案是：

if (event.preventDefault)
    event.preventDefault();
else
    event.returnValue= false;
return false;

Answer 3

由于Firefox（也可能是Opera）已经从开发人员手中获取了中间点击行为，我建议用不同的节点替换锚节点，例如<span>。< / p>

这似乎是语义上的O.K，因为<a>标记在您的使用场景中不再作为实际链接。它可以使用CSS保持其外观。

可在此jsfiddle中找到实时示例。

对于这种标记：

<a class="ajaxFormDialog" href="#">replaced link</a>

您可以使用CSS，例如：

a, .ajaxFormDialog {
    color: orange;
    text-decoration: underline;
    cursor: hand;
}

a:hover, .ajaxFormDialog:hover {
    background: orange;
    color: white;

}

并用span替换锚点，包括存储任何所需属性和维护任何子节点（如果有）的能力。您可以稍后在事件处理程序中检索这些属性。

示例代码如下：

var genericHandler = function(e) {
    var el = $(e.target);
    var href = el.data('href');
    //extract data
    console.log('clicked span: ',el, ' with stored href: ', href);
    //do stuff here
};

$('a.ajaxFormDialog').replaceWith(function(){
    var el = $(this);
    console.log('replacing element: ', el);
    return $("<span>").addClass('ajaxFormDialog').append($(this).contents()).
        data('href', el.attr('href')). //you can store other data as well
        click(genericHandler);
});

如果您希望暂时避免出现中间点击的副作用，这似乎是所有邪恶中的较小者。

禁用模式对话框的鼠标中键

3 个答案: