0

环境：-jquery 1.9.1-qtip2：2.0.1-35

我在打开绑定右键单击的 qtip2 时遇到了一个奇怪的问题（作为上下文菜单替换，按照官方教程进行操作）。

在 Firefox 上，一切顺利，只要我右键单击目标元素，就会显示上下文菜单。在 Chrome 上，由于未知原因，我必须左键单击然后右键单击目标才能使 qtip 工作。

我的测试环境

奇怪的是，它在两个浏览器上都能正常工作，这个小提琴：http: //jsfiddle.net/PaQ7R/10/

具有完全相同的源代码。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
      <script src="jquery/jquery-1.9.1.js"></script>
      <script type='text/javascript' src="jquery/jquery.qtip.js"></script>
      <link rel="stylesheet" type="text/css" href="css/jquery.qtip.css">
  <style type='text/css'>
        ul#candMenu {
            display: none;
        }
  </style>
<script type='text/javascript'>
$(document).ready( function() {
    $(document).on("mousedown", ".test", function(event) {
        $(this).qtip({
            content: {
                text: $("#candMenu").clone()
            },
            show: {
                event: "mouseup",
                ready: true, 
                solo: true
            },
            hide: {
                event: "unfocus" // Si qqchose d autre que le tooltip est cliqué
            },
            position: {
                my: "left top",
                target: "mouse", // Position it where the click was...
                adjust: { mouse: false }, // ...but dont follow the mouse
                viewport: $(window) // empêche le débordement de la fenêtre
            },
            events: {
                show: function(eventShow, api) {
                    if(eventShow.originalEvent.which !== 3) {
                        eventShow.preventDefault();
                    }
                }
            }
        }, event);
    }).bind("contextmenu", function() { return false; });
});

</script>
</head>
<body>
  <a href="javascript:;" class="test">Test right click</a><br />
  <a href="javascript:;">No-test</a>

<table border="1" width="100%">
    <tr class="test">
        <td>prem</td>
        <td>seco</td>
        <td>third</td>
    </tr>
    <tr class="test">
        <td>prem</td>
        <td>seco</td>
        <td>third</td>
    </tr>
</table>
<UL id="candMenu">
    <LI class="event separator"><A href="javascript:;">Événements<SPAN class="holdctrl"></SPAN></A></LI>
        <LI class="edit"><A href="javascript:;">Infos du candidat<SPAN class="holdctrl"></SPAN></A></LI>
        <LI class="permis"><A href="javascript:;">Demande de permis<SPAN class="holdctrl"></SPAN></A></LI>
        <LI class="prod"><A href="javascript:;">Produits<SPAN class="holdctrl"></SPAN></A></LI>
        <LI class="regle"><A href="javascript:;">Règlements<SPAN class="holdctrl"></SPAN></A></LI>
        <LI class="form"><A href="javascript:;">Formation<SPAN class="holdctrl"></SPAN></A></LI>
</UL>
</body>
</html>

我也在非 SSL 环境中尝试过同样奇怪的行为。我找不到小提琴环境中的技巧或我的服务器上的错误配置来解释这种差异。

4

1 回答 1

0

这可以通过在用户配置文件中删除与其相关的所有文件后重新安装 Chrome 来解决。

于 2013-04-11T11:38:51.390 回答