Nested IF in Jquery - proper javascript syntax

Question

Trying to find how to pass the var msg results for arguments from this jquery function in an IF statement:

$(document).mousemove(function( event ) {
var msg = "Handler for .mousemove() called at ";
msg += event.pageX + ", " + event.pageY;
if (msg->event.pageX > '750'){
$( "‪#‎log‬" ).append( "<div>" + msg + "</div>" );
}});

What am I doing wrong?

why not `if (event.pageX > '750'){` ? What is the role of `msg` in your if condition? — gurvinder372, Apr 16 '16 at 13:04
to preform some sort of action, let's say draw for instance. — erezT, Apr 16 '16 at 13:07
What is `msg->event.pageX` supposed to mean? What is it that you're trying to express? It's not at all clear from the question. — Pointy, Apr 16 '16 at 13:08
@erezT But you are not going to draw inside the `(condition)`, it will be inside the if block right? — gurvinder372, Apr 16 '16 at 13:08
@gurvinder372 [`event.pageX` is a Number](http://api.jquery.com/event.pagex) :) so `event.pageX > 750`. — GG., Apr 16 '16 at 13:09
understood @gurvinder, so if I would like to create some sort of heatmap that would take the vars and manipulate them later, what would be the proper way to syntax this? I'll happily set it as the answer. — erezT, Apr 16 '16 at 13:09
@pointy , i'm trying to create an equivalent of a 'heat-map' to be drawn on a seperate PHP. — erezT, Apr 16 '16 at 13:13
A separate PHP? What? What does `msg->event.pageX` have to do with a "heat map"? — Pointy, Apr 16 '16 at 13:14
And how does any of this relate to php which runs on the server? Please read [ask] — charlietfl, Apr 16 '16 at 13:50
@charlietfl My question was only referring to Jquery, referencing to the vars passed. Pointy then asked in a comment: "What is msg->event.pageX supposed to mean?" so I went on to explain to you that I would be later passing that var back to PHP, no need to downvote my question, I can't understand why instead of helping and answering people here are spam modding with comments: " separate PHP? What? What does msg->event.pageX have to do with a "heat map"?") -that's rude and unappreciated. — erezT, Apr 16 '16 at 21:05
The person that asked about the heat map has 1/4 million points here....from helping people. It's important to learn how to ask questions properly and not be offended when clarification questions are asked. These clarifications are not being rude...it's not always easy to understand intent — charlietfl, Apr 16 '16 at 21:11

gurvinder372 · Accepted Answer · 2016-04-16T14:19:13.837

1

I would like to create some sort of heatmap that would take the vars and manipulate them later, what would be the proper way to syntax this

Something like this

$(document).mousemove(function( event ) {
 var map=   {} ;
 var msg = event.pageX + ", " + event.pageY;
  map.x = event.pageX - 0; 
  map.y = event.pageY - 0; 
  if ( map.x > 750)
  {
    var msg = "Handler for .mousemove() called at ";
    $( "‪#‎log‬" ).append( "<div>" + msg + "</div>" );
  }
});

edited Apr 16 '16 at 14:19

answered Apr 16 '16 at 13:13

gurvinder372

66,980
10
72
94

1

erez.js:7 Uncaught ReferenceError: msg is not defined – erezT Apr 16 '16 at 13:53
works excellent, how would I able to use these vars? whenever I tried to console.log(map) it returned that 'map is not defined. thanks!! – erezT Apr 16 '16 at 14:57
1

Then you need to define them outside the event handler – gurvinder372 Apr 16 '16 at 15:22

score 0 · Answer 2 · edited May 23 '17 at 10:33

I propose you to take a look to debounce because the mousemove event is triggered so many often and fast and so you may write something like:

// from https://github.com/m-gagne/limit.js/blob/master/limit.js
Function.prototype.debounce = function (milliseconds, context) {
  var baseFunction = this,
      timer = null,
      wait = milliseconds;

  return function () {
    var self = context || this,
        args = arguments;

    function complete() {
      baseFunction.apply(self, args);
      timer = null;
    }

    if (timer) {
      clearTimeout(timer);
    }

    timer = setTimeout(complete, wait);
  };
};

$(function () {
  $(document).on('mousemove', function(event) {
    if (event.pageX > 150){
      $('#log').append( '<p>' + 'Handler for .mousemove() called at ' + event.pageX + ', ' + event.pageY + '</p>');
    }
  }.debounce(5)); // debounce with a 5 millisecond limit

});

<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>

<div id="log">

</div>

Very interesting thought, trying it on mate. – erezT Apr 16 '16 at 13:55 — erezT, Apr 16 '16 at 13:55

Nested IF in Jquery - proper javascript syntax

2 Answers2