Question

jquery如何获取手机网页触屏坐标

使用原生js可以获取到，但我想用jquery的格式，改如何写呢
原生js：
var banner = document.getElementById("banner");
$_banner.ontouchstart = function(e){
var touch = e.touches[0];
var x = touch.clientX;
var y = touch.clientY;
alert(x);
};//这样可以获取到
jquery格式：
$("#banner").bind("touchstart",function(e){
var touch = e.touches[0];
var x = touch.clientX;
var y = touch.clientY;
alert(x);
})//这样就获取不到了，但绑定的触屏事件是可以触发的。

求大神解释啊。

Answer 1

function handleTouchEvent(event) {
    //只跟踪一次触摸
    if (event.touches.length == 1) {
        var output = document.getElementById("output");
        switch (event.type) {
            case "touchstart":
                output.innerHTML = "Touch started (" + event.touches[0].clientX + "," + event.touches[0].clientY + ")";
                break;
            case "touchend":
                output.innerHTML += "<br>Touch ended (" + event.changedTouches[0].clientX + "," + event.changeTouches[0].clientY + ")";
                break;
            case "touchmove":
                event.preventDefault(); //阻止滚动
                output.innerHTML += "<br>Touch moved (" + event.changedTouches[0].clientX + "," + event.changedTouches[0].clientY + ")";
                break;
        }
    }
}
document.addEventListener("touchstart", handleTouchEvent, false);
document.addEventListener("touchend", handleTouchEvent, false);
document.addEventListener("touchmove", handleTouchEvent, false);

1. touchstart ：手指放在一个DOM元素上。
2. touchmove ：手指拖曳一个DOM元素。
3. touchend ：手指从一个DOM元素上移开

追问

大神，这怎么用啊~只要加上这些代码就行了是么？

追答

这是监听整个页面的触摸事件。加上这个代码后，忘记了有个变量定义了 就是 output这个。

你在页面建立一个id 放上代码 就可以看到测试结果了。

<p id="output">这里显示坐标</p>
<script>
...上面的js代码复制到这，就可以了
</script>