Javascript 按下CTRL键时鼠标光标后面的文本

我需要检测用户在红色div框上按下CTRL键的时间。在这种情况下，我需要在鼠标旁边插入文本Ctrl键。只要按下CTRL键，此文本就必须跟随鼠标光标。如果鼠标离开红色div框，则必须隐藏文本。此外，用户可以在不移动鼠标的情况下按下红色框内的ctrl键，并且在释放ctrl键时还必须显示和隐藏文本

第1版HTML代码：

<div id="container">
    <div id="box" style="width: 300px; height: 200px; background-color: red;">
        Hello world
    </div>
</div>

第1版JAVASCRIPT代码：

    var mousePosition;
    $('#container').append('<p id="besideMouse">Ctrl key pressed</p>');
    $('#box').mousemove(function (e) {
        mousePosition = { top: e.pageY + 10, left: e.pageX + 10 };
    });
    $("#box").hover(function (e) {

        $(document).keydown(function (e) {
            if (e.ctrlKey) $('#besideMouse').show().offset(mousePosition);
        });
        $(document).keyup(function (e) {
            if (!e.ctrlKey) $('#besideMouse').hide();
        });
    }, function (e) {
        $(document).unbind("keydown");
        $('#besideMouse').hide();
    }); 

JSFIDDLE：

它与Google Chrome和Internet Explorer兼容

请注意，对于JSFIDLE内部的测试，请首先在结果区域内单击，否则它将不起作用

它可以工作，但由于一些在这个基本示例中不可见的原因，现在我需要使用实时事件处理程序。简而言之，原因是我有一个动态的网格，当排序时它不再工作，所以我需要重构这些代码

因此，我尝试重构，请参见第2版：

但谷歌CHROME的问题仅限于第二个版本：当我的鼠标光标位于红色框内，按下ctrl键时不移动光标，文本将不再显示。它适用于IE，但不适用于GC

你知道如何解决第二个问题吗

PS：也许我的代码不是很有效，所以如果有必要，请毫不犹豫地修改它

---

谢谢。

谢谢，非常有趣。一个问题：你知道一种避免在区域内先点击的方法吗？哈，这是JSFIDLE上唯一需要的。因为脚本运行在另一个帧中，无法捕获所有事件。