我有以下代码,允许运行iOS的用户移动< div>在页面上的.drag类.当存在一个.drag的时,这可以正常工作,但是当它有两个实例时却无法工作.是否可以让代码找到所有的< div>,然后让它们可以拖动?
var drag = $(".drag")[0];
xPos = drag.offsetWidth / 2;
yPos = drag.offsetHeight / 2;
drag.addEventListener("touchmove",function() {
event.preventDefault();
$(this).css({
'left' : event.targetTouches[0].pageX - xPos + 'px','top' : event.targetTouches[0].pageY - yPos + 'px'
});
});
最佳答案
当您使用$(selector)[0]时,您将获得与选择器匹配的第一个DOM元素.使用.each()代替将事件侦听器添加到与选择器匹配的所有元素:
$(".drag").each(function () {
var drag = this;
xPos = drag.offsetWidth / 2;
yPos = drag.offsetHeight / 2;
drag.addEventListener("touchmove",function() {
event.preventDefault();
$(this).css({
'left' : event.targetTouches[0].pageX - xPos + 'px','top' : event.targetTouches[0].pageY - yPos + 'px'
});
});
});