0
更新された質問と回答！object.watchを現在のスクリプトに組み込む？混乱しました
元の質問
私はイーライのobject.watch（https://gist.github.com/384583）スクリプトを見てきたと私はそれの考えを理解し、それが何をするかが、私は」私は実際にスクリプトでどのように使用するのか混乱してしまいました。これがほとんどの場合にはっきりと見えても、私はそれを見ていません：S
私はそれに完全に間違ったアプローチをしようとしているかもしれませんし、object.watchは私が実際に使用する必要があるものではありません！
私はここのスクリプトを持っている：
<script type="text/javascript">
jQuery.fn.elementlocation = function() {
var curleft = 0;
var curtop = 0;
var obj = this;
do {
curleft += obj.attr('offsetLeft');
curtop += obj.attr('offsetTop');
obj = obj.offsetParent();
} while (obj.attr('tagName') != 'BODY');
return ({x:curleft, y:curtop});
};
$(document).ready(function() {
$("#gdimage").mousemove(function(eventObj) {
var location = $("#gdimage").elementlocation();
var x = eventObj.pageX - location.x;
var y = eventObj.pageY - location.y;
x = x/5;
y = y/5;
x = (Math.floor(x) + 1);
y = (Math.floor(y) + 1);
if (y > 1) {
block = (y * 200) - 200;
block = block + x;
} else {
block = x;
}
x = ((x * 2) + (x*3)) - 4;
y = ((y * 2) + (y*3)) - 4;
x = (Math.floor(x));
y = (Math.floor(y));
$("#block").text(block);
$("#x_coords").text(x);
$("#y_coords").text(y);
$.ajax({
type: "GET",
url: "fetch.php",
data: "x=" + x + "&y=" + y + "",
dataType: "json",
async: false,
success: function(data) {
$("#user_name_area").html(data.username);
}
});
$("#gdimage").click(function(eventObj) {
window.location = "/redirect/?x=" + x + "?y=" + y + "";
});
});
});
</script>
今、あなたが言うことができるように、サーバーの負荷が常にAJAXを通じてfetch.phpページからデータを呼び出して、マウスの移動にはかなり高くなります。だから、私がしようとしているのは、変数 "ブロック"が値を変更するときにAJAXを呼び出すことだけです。
私は、どこかに値を格納しなければならないと仮定しています。値が変更されると、格納された値でチェックされますが、もちろん、格納された値は常に新しい値に変更されます変数を変更しますか？
ANSWER
私がobject.watch使いたいで間違ったアプローチを取っていた表示されます - HTTP（SitePointでオーバーpaul_wilkinsからの助けを借りて、彼は私にjQueryのデータを使用して情報を格納するための方法を示しました：/ /api.jquery.com/data）。また、私の式を簡素化することは、あまりにも（笑）ここで
が新しいコードです：
<script type="text/javascript">
jQuery.fn.elementlocation = function() {
var curleft = 0;
var curtop = 0;
var obj = this;
do {
curleft += obj.attr('offsetLeft');
curtop += obj.attr('offsetTop');
obj = obj.offsetParent();
} while (obj.attr('tagName') != 'BODY');
return ({x:curleft, y:curtop});
};
$(document).ready(function() {
$("#gdimage").mousemove(function(eventObj) {
var location = $("#gdimage").elementlocation();
var x = eventObj.pageX - location.x;
var y = eventObj.pageY - location.y;
x = x/5;
y = y/5;
x = (Math.floor(x) + 1);
y = (Math.floor(y) + 1);
block = x + (y * 200) - 200;
x = ((x * 2) + (x*3)) - 4;
y = ((y * 2) + (y*3)) - 4;
x = (Math.floor(x));
y = (Math.floor(y));
$("#block").text(block);
$("#x_coords").text(x);
$("#y_coords").text(y);
if (block != $('#gdimage').data('storedBlock')) {
$.ajax({
type: "GET",
url: "fetch.php",
data: "x=" + x + "&y=" + y + "",
dataType: "json",
async: false,
success: function(data) {
$("#user_name_area").html(data.username);
}
});
}
$('#gdimage').data('storedBlock', block);
$("#gdimage").click(function(eventObj) {
window.location = "/redirect/?x=" + x + "&y=" + y + "";
});
});
});
</script>