Хөтөчийн цонхонд курсорыг шилжүүлэхийн тулд зарим үйлдлийг програмчлахын тулд заримдаа түүний координатыг тодорхойлох шаардлагатай болдог. Үүнийг хөтөч дээр гарч буй үйл явдлыг хянах чадвартай скриптээр хийж болно. Үйлчлүүлэгч талын JavaScript скрипт нь ийм чадвартай байдаг. Энэ хэлний чадварыг ашиглан курсорын координатыг олж авах хувилбаруудын нэгийг доор тайлбарлав.
Зааварчилгаа
1-р алхам
Курсорын одоогийн координатыг авахын тулд үйл явдлын объектын шинж чанарыг ашиглана уу. Энэ объект нь хулганы курсорын координатыг тодорхойлоход хамааралтай бүхэл бүтэн шинж чанартай байдаг. LayerX шинж чанар нь одоогийн давхаргын зүүн ирмэгээс пикселээр хэмжигдэх зайг, LayerY нь түүний дээд ирмэгээс ижил зайг агуулна. Эдгээр хоёр шинж чанар нь ижил утгатай байдаг: event. LayerX-ийн оронд event.x, харин event. LayerY-ийн оронд event.y гэж бичиж болно. PageX ба pageY шинж чанарууд нь курсорын хэвтээ ба босоо координатуудыг хөтөчийн цонхны зүүн дээд ирмэгтэй харьцуулж, screenX ба screenY шинж чанарууд нь дэлгэцийн дэлгэцтэй харьцуулж ижил утгыг агуулдаг.
Алхам 2
Өөрийн код дээр хөтчийн төрлийг нэмж оруулаад, үйл явдлын объект дээрх дээрх шинж чанаруудаас гадна clientX ба clientY шинж чанаруудыг ашиглана уу. Майкрософт нь Internet Explorer хөтөч дээрээ өөр өмчийн тэмдэглэгээг ашигладаг тул энэ нь зайлшгүй шаардлагатай юм. Жишээлбэл, та координатыг тодорхойлох хоёр аргыг хоёуланг нь нэгтгэж болно.
хэрэв (evevnt.pageX || evevnt.pageY) {
coordinateX = evevnt.pageX;
coordinateY = evevnt.pageY;
}
өөр бол (evevnt.clientX || evevnt.clientY) {
coordinateX = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
ordinYY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
Алхам 3
Координатын тодорхойлолтын кодыг захиалгын функцэд байрлуул. Жишээлбэл:
GetMouse функц (evevnt) {
varordininateX = 0, координатY = 0;
хэрэв (! evevnt) evevnt = window.event;
хэрэв (evevnt.pageX || evevnt.pageY) {
coordinateX = evevnt.pageX;
coordinateY = evevnt.pageY;
}
өөр бол (evevnt.clientX || evevnt.clientY) {
coordinateX = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
ordinYY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
return {"coordX": coordinateX, "coordY": coordinateY};
}
Энэ функц нь нэртэй хоёр элементийн массивыг буцаадаг бөгөөд эхнийх нь (coordX товчлуурын хамт) X координатыг, хоёр дахь (coordY) нь Y координатыг агуулна.
Алхам 4
Энэ үйлдлийг зарим үйл явдал дээр дуудах - жишээлбэл, баримт бичгийн контекст дэх хулгана шилжүүлэх үйл явдал (onmousemove) дээр. Доорх жишээнд хулганы координатыг статус мөрөнд гаргах функцийг ашиглана.
document.onmousemove = function (evevnt) {var CurCoord = GetMouse (evevnt); window.status = "coord X:" + CurCoord.coordX + "px, координат Y:" + CurCoord.coordY + "px";};
