javascript - If condition not working in Javascript/Jquery

Question

b.addEventListener('touchend', function (event) {
    event.preventDefault();

    end_x_position = (event.changedTouches[0].pageX + 'px');
    end_y_position = event.changedTouches[0].pageY + 'px';

    if ((posX < end_x_position) && (end_x_position < totalWidth)) //THIS PART DOESNOT RUN EVEN IF CONDITION IS TRUE
    {
        console.log("iff");
        alert("iff");
        b.style.left = intial_x_position;
        b.style.top = intial_y_position;
    } else {
        console.log("else");

        b.style.left = end_x_position - xbox;
        b.style.top = end_y_position - ybox;
    }

}, false);

Answer 1

if((posX<end_x_position)&&(end_x_position<totalWidth)) //THIS PART DOESNOT RUN EVEN IF CONDITION IS TRUE

For example, this is like trying this:

3 < "hello world"

Check some of your first lines:

end_x_position=(event.changedTouches[0].pageX + 'px');
end_y_position=event.changedTouches[0].pageY + 'px';

The whole end_x_position will hold something like 400px. This is a string and you can't compare String with Number.

Instead of that, you should do this:

end_x_position= parseInt(event.changedTouches[0].pageX);
end_y_position= parseInt(event.changedTouches[0].pageY);

And your if statement will work as expected as you'll be comparing Number with Number.

Answer 2

you stringed it with this line:

end_x_position=(event.changedTouches[0].pageX + 'px');
end_y_position=event.changedTouches[0].pageY + 'px';

leave off the px or do this:

if((posX< parseInt(end_x_position))&&( parseInt(end_x_position) <totalWidth))