Question

我想在mousemove处于活动状态时在段落中显示true，在不活动时显示false。尝试了if声明，但没有效果

$(document).ready(function() {
    var Clickcount = 1;

    $(".chimp").mousemove(function(e) {
        if (Clickcount % 2) {
            $('.chimp').css({
                'top': e.clientY - 20,
                'left': e.clientX - 20
            });
        }
    });

    $("body").mousemove(function(e) {
        var x = e.pageX - this.offsetLeft;
        var y = e.pageY - this.offsetTop;
        $(".cords").html("clientX " + x + " clientY= " + y);
    });

    $(document.body).on('click', function() {
        Clickcount++;
    });
});

Answer 1

我不太确定你对mousemove is active的意思。如果你想检查鼠标是否是一个特定的元素，你可以使用这样的东西：

$(".chimp").hover(function () {
    $("#bool").text('true');  
},function () {
    $("#bool").text('false');  
});

<强> Demo

但是如果你想检测鼠标是否已经停止移动，你可以尝试使用这个代码片段：

var timeout;
$(".chimp").mousemove(function () {
    $("#bool").text('true');  
    clearTimeout(timeout);

    timeout = setTimeout(function() {
        $("#bool").text('false');  
    }, 1000);
});

如果鼠标未移动1秒钟，将触发此操作。您可以轻松调整阈值，只需编辑timeout - 函数中的数字。

<强> Demo

Answer 2

使用＆＃34; html＆＃34;而不是＆＃34; body＆＃34;

＆＃13;

    $("html").mousemove(function(e) {
        var x = e.pageX - this.offsetLeft;
        var y = e.pageY - this.offsetTop;
        $(".cords").html("clientX " + x + " clientY= " + y);
    });

＆＃13;

.cords {
  width: 20em;
  height: 2em;
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

<div class="cords"></div>

＆＃13;

Answer 3

在这里

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Drag Me</title>  
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<style>
#dragg
{
    position: absolute;
    background-color: red;
    height: 200px;
    width: 200px;
}
p{
  position: relative;
  top: 210px;
  right: 5px;
}
</style>

</head>

<body>

<div id="dragg">
red
</div>
<p id="bool"></p>
<script>
$(document).ready(function () {
        $('#dragg').on({
            mousedown: function (e) {
                $(window).data({
                    down:true,
                    oX: e.offsetX,
                    oY: e.offsetY,
                    el:this
                })
            },
            mouseup: function (e) {
                $(window).data('down',false)
            },
        })
        $(window).on({
            mousemove: function (e) {
                var data=$(window).data()
                if (data.down) {
          $("#bool").text('true'); 
                    $(data.el).css({
                        left: e.clientX - data.oX,
                        top: e.clientY - data.oY
                    });
                }
        else{
          $("#bool").text('false'); 
        }
            },
        })
});
</script>

</body>
</html>

当mousemove处于活动状态时显示文本

3 个答案: