Theննարկչի պատուհանում կուրսորի շարժմանն ի պատասխան որոշ գործողություններ ծրագրավորելու համար երբեմն անհրաժեշտ է որոշել դրա կոորդինատները: Դա կարող է կատարվել սցենարի միջոցով, որը հնարավորություն ունի դիտելու զննարկչում տեղի ունեցող իրադարձությունները: Հաճախորդի կողմից JavaScript գրությունը ունի այս հնարավորությունը: Ստորև նկարագրված է այս լեզվի հնարավորությունները օգտագործելով կուրսորի կոորդինատները ստանալու տարբերակներից մեկը:
Հրահանգներ
Քայլ 1
Օգտագործեք իրադարձության օբյեկտի հատկությունները `կուրսորի ընթացիկ կոորդինատները ստանալու համար: Այս օբյեկտը ունի հատկությունների մի ամբողջ շարք, որոնք կարևոր են մկնիկի կուրսորի կոորդինատները որոշելու համար: LayerX հատկությունը պարունակում է ընթացիկ շերտի ձախ եզրից պիքսելներով չափված հեռավորությունը, իսկ LayerY - նույն վերևի եզրից նույն հեռավորությունը: Այս երկու հատկություններն ունեն հոմանիշներ. Իրադարձության փոխարեն: Շերտ X, դուք կարող եք գրել event.x և իրադարձության փոխարեն: Շերտ, կարող եք գրել իրադարձություն. PageX- ի և pageY- ի հատկությունները պահում են կուրսորի հորիզոնական և ուղղահայաց կոորդինատները `զննարկիչի պատուհանի վերին ձախ եզրին համեմատ, իսկ screenX- ը և screenY- ի հատկությունները պահում են մոնիտորի էկրանի համեմատությամբ նման արժեքներ:
Քայլ 2
Ձեր կոդին ավելացրեք զննարկչի տիպի ստուգում և բացի իրադարձության օբյեկտի վերը նշված հատկություններից, օգտագործեք clientX և clientY հատկությունները: Դա անհրաժեշտ է, քանի որ Microsoft- ն իր Internet Explorer բրաուզերում օգտագործում է գույքի այլ նշանակություն: Դուք կարող եք համատեղել կոորդինատները որոշելու երկու մոտեցումները, օրինակ, այսպես.
եթե (evevnt.pageX || evevnt.pageY) {
կոորդինատ X = evevnt.pageX;
համակարգել Y = evevnt.pageY;
}
այլապես եթե (evevnt.clientX || evevnt.clientY) {
կոորդինատ X = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
համակարգելY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
Քայլ 3
Տեղադրեք կոորդինատների սահմանման կոդը գործառույթի մեջ: Օրինակ:
գործառույթ GetMouse (evevnt) {
var կոորդինատ X = 0, կոորդինատY = 0;
եթե (! evevnt) evevnt = windows.event;
եթե (evevnt.pageX || evevnt.pageY) {
կոորդինատ X = evevnt.pageX;
համակարգել Y = evevnt.pageY;
}
այլապես, եթե (evevnt.clientX || evevnt.clientY) {
կոորդինատ X = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
համակարգելY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
վերադարձնել {"ordinX ": կոորդինատ X," կոորդինատ ": կոորդինատY};
}
Այս ֆունկցիան վերադարձնում է անվանված երկու տարրերի զանգված, որոնցից առաջինը (ordinX ստեղնով) պարունակում է X կոորդինատ, իսկ երկրորդը (ordinY) պարունակում է Y կոորդինատ:
Քայլ 4
Functionանգահարեք այս գործառույթը ինչ-որ իրադարձության վրա, օրինակ `մկնիկի շարժման իրադարձության վրա (onmousemove) փաստաթղթի համատեքստում: Ստորև ներկայացված նմուշը օգտագործում է գործառույթ ՝ մկնիկի կոորդինատները կարգավիճակի տող դուրս բերելու համար.
document.onmousemove = գործառույթ (evevnt) {var CurCoord = GetMouse (evevnt); windows.status = "կոորդինատ X:" + CurCoord.coordX + "px, կոորդինատ Y:" + CurCoord.coordY + "px";};
