Question

我正在使用Google Map Api，我使用ajax更新sql qith此代码：

$(document).ready(function() {
  $('#map').click(function() {
    var request = $.ajax({
      url: "php/clic.php",
      data: {
        label: "value"
      },
      method: "POST"
    });

    request.done(function() {
      // Do something after its done.
    });
  });
});

映射谷歌地图的div。

问题是代码clic.php在用户点击div时执行，但如果用户点击移动地图也是如此。我不太了解ajax，所以我想做一个其他条件来检测它是一个移动/ clic而不是简单的clic！

THX！

Answer 1

检查event.target以查看它是否为#map元素。

$("#map".click(function() {
    if (event.target != this) {
        return;
    }
    // rest of function
});

Answer 2

代码在Chrome上为我工作：

    (function($){
var $doc = $(document),
moved = false,
pos = {x: null, y: null},
abs = Math.abs,
mclick = {
'mousedown.mclick': function(e) {
pos.x = e.pageX;
pos.y = e.pageY;
moved = false;
},
mouseup.mclick': function(e) {
moved = abs(pos.x - e.pageX) > $.clickMouseMoved.threshold
|| abs(pos.y - e.pageY) > $.clickMouseMoved.threshold;
}
};

$doc.on(mclick);

$.clickMouseMoved = function () {
return moved;
};

$.clickMouseMoved.threshold = 3;
})(jQuery);


// test delegated
$(document).on('click', '#map', function(e) {
if ($.clickMouseMoved()) {
console.log('click aborted');
return;            
}
//console.log('click');
var request = $.ajax({
url: "php/clic.php",
data: { label: "value" },
method: "POST"
});
});

// test bound
$('#map').on('click', function(e) {
if ($.clickMouseMoved()) {
// console.log('click aborted');
return;           
}
var request = $.ajax({
url: "php/clic.php",
data: { label: "value" },
method: "POST"
});
//console.log('click');
});

Ajax单击不同的移动鼠标，但有一个单击

2 个答案: