মাউস-ইভেন্টগুলি ছাড়াই কীভাবে jQuery এ মাউস পজিশন পাবেন?


101

আমি বর্তমানের মাউস অবস্থানটি পেতে চাই তবে আমি এটি ব্যবহার করতে চাই না:

$(document).bind('mousemove',function(e){ 
        $("#log").text("e.pageX: " + e.pageX + ", e.pageY: " + e.pageY); 
}); 

কারণ আমার কেবল অবস্থান এবং তথ্য প্রক্রিয়া করা দরকার


3
.পেজএক্সএক্স এবং .পৃষ্ঠাটি কেবল .mousemove () নয়, কোনও ইভেন্টের বাইরে পড়তে পারেন। উদাহরণস্বরূপ, সম্ভবত আপনি জানতে চান যে কোনও ব্যবহারকারী একটি নির্দিষ্ট ডিভের ভিতরে কোথায় ক্লিক করেছেন: এখানে একটি উদাহরণ যেখানে আমরা একটি বিশেষ ডিভের ভিতরে ক্লিক ইভেন্টের জন্য শুনি যেখানে # স্পেশাল নামে পরিচিত। ..... docs.jquery.com/…
হাইম

এটি আপনাকে প্রতিক্রিয়াশীল সাইটগুলির জন্য মাউস পয়েন্টার অবস্থানগুলি পেতে সহায়তা করতে পারে। kvcodes.com/2014/03/…
Kvvaradha

উত্তর:


151

আমি বিশ্বাস করি না যে মাউসের অবস্থান সম্পর্কে জিজ্ঞাসা করার কোনও উপায় আছে , তবে আপনি mousemoveএমন একটি হ্যান্ডলার ব্যবহার করতে পারেন যা কেবল তথ্য সঞ্চিত করে রাখে, তাই আপনি সঞ্চিত তথ্যটিকে জিজ্ঞাসা করতে পারবেন।

jQuery(function($) {
    var currentMousePos = { x: -1, y: -1 };
    $(document).mousemove(function(event) {
        currentMousePos.x = event.pageX;
        currentMousePos.y = event.pageY;
    });

    // ELSEWHERE, your code that needs to know the mouse position without an event
    if (currentMousePos.x < 10) {
        // ....
    }
});

তবেsetTimeout কোড এবং এ জাতীয় ব্যতীত প্রায় সমস্ত কোডই একটি ইভেন্টের প্রতিক্রিয়া হিসাবে চালিত হয় এবং বেশিরভাগ ইভেন্ট মাউসের অবস্থান সরবরাহ করে। সুতরাং আপনার কোড যা জানা দরকার যে মাউসটি সম্ভবত ইতিমধ্যে সেই তথ্যে অ্যাক্সেস পেয়েছে ...


7
$(window).load(function(e){ console.log(e.pageX,e.pageY); });মাউস পজিশনের জন্য
অপরিজ্ঞাপিত

9
@ টিজে ক্রাউডার আমার কাছে মোটামুটি সুস্পষ্ট বলে আমি মনে করি, তিনি বলছেন যে "একটি প্রায় সমস্ত (সমস্ত?)" ইভেন্টগুলি মাউস পজিশন সরবরাহ করে এমন উত্তরের জবাব দেওয়ার জন্য সেখানে একটি ঘটনা আছে যা মাউস অবস্থানটি সরবরাহ করে না।
ফাবস্প্রো

2
@ টিজে ক্রাউডার ডিফেন্সে তিনি খুব কমই বলেছিলেন। এমন কোনওটির সাথে প্রতিক্রিয়া জানানো যা সমস্ত সহায়ক বা উদ্দেশ্যমূলক নয়। আমি মনে করি এই উত্তরের পয়েন্টটি ব্যবহারকারীকে দেখাচ্ছে যে তার উদাহরণে তাকে মাউস মুভ ব্যবহার করতে হবে না ... তিনি কিছু ব্যবহার করতে পারেন। ব্যবহারকারী কোনও অনুষ্ঠান ছাড়াই এটি বিশেষভাবে বলেননি, যা টিজেক্রোডার কয়েকটি ইভেন্টের পরে প্রায় সমস্ত কোড ঘটে বলে উল্লেখ করে। অবশ্যই তিনি এই আফটারের পরে আপনার নিজের ফাংশনটি তৈরি করার একটি কার্যকর উপায় দেখিয়ে উল্লেখ করেছেন যা তার প্রয়োজন অনুযায়ী করে। উত্তর আমাকে যাইহোক সাহায্য করেছিল।
টাইলার

1
@ টাইলার: ধন্যবাদ :-) "প্রায় সব "ই পরবর্তী পরিবর্তন ছিল, আমার প্রাথমিক ভাষাটি খুব শক্তিশালী ছিল।
টিজে ক্রাউডার

26

কোনও ইভেন্ট না ব্যবহার করে আপনি jQuery এ মাউস পজিশনটি পড়তে পারবেন না। প্রথমে দ্রষ্টব্য যে কোনও ইভেন্টে event.pageXএবং event.pageYবৈশিষ্ট্যগুলি বিদ্যমান, তাই আপনি এটি করতে পারেন:

$('#myEl').click(function(e) {
    console.log(e.pageX);
});

আপনার অন্য বিকল্পটি হ'ল মাউসমোভ হ্যান্ডলার দ্বারা আপডেট হওয়া একটি ভেরিয়েবলটিতে আপনার সম্পূর্ণ কোড অ্যাক্সেস দেওয়ার জন্য একটি ক্লোজার ব্যবহার করা:

var mouseX, mouseY;
$(document).mousemove(function(e) {
    mouseX = e.pageX;
    mouseY = e.pageY;
}).mouseover(); // call the handler immediately

// do something with mouseX and mouseY

এর সাথে একটি সমস্যা হ'ল ফায়ারফক্সে টেনে আনার সময় আপনার পেজএক্স এবং পেজওয়াই বা ক্লায়েন্টএক্স এবং ক্লায়েন্টওয়াই নেই ... টেনে আনার সময় পেজওয়াই পেতে কোনও উপায়?
জেমসটিবেনেট

11

আমি এই পদ্ধতিটি ব্যবহার করেছি:

$(document).mousemove(function(e) {
    window.x = e.pageX;
    window.y = e.pageY;
});

function show_popup(str) {
    $("#popup_content").html(str);
    $("#popup").fadeIn("fast");
    $("#popup").css("top", y);
    $("#popup").css("left", x);
}

এইভাবে আমি সর্বদা y- র মধ্যে শীর্ষে সঞ্চয় করা শীর্ষ থেকে দূরত্ব এবং বাম দিক থেকে দূরত্ব x এ সংরক্ষণ করব।


6

অধিকন্তু, mousemoveঘটনা আলোড়ন সৃষ্টি করা হয় না আপনি একটি ব্রাউজার উইন্ডোতে ওভার সরান এবং নিক্ষেপ সঞ্চালন। ড্রাগ'আরড্রপ চলাকালীন মাউস স্থানাঙ্কগুলি ট্র্যাক করতে আপনার document.ondragoverইভেন্টের জন্য হ্যান্ডলার সংযুক্ত করা উচিত এবং এটির আসল ইভেন্ট সম্পত্তিটি ব্যবহার করা উচিত ।

উদাহরণ:

var globalDragOver = function (e)
{
    var original = e.originalEvent;
    if (original)
    {
        window.x = original.pageX;
        window.y = original.pageY;
    }
}

2

ব্যবহারের window.event- এটা গত রয়েছে eventএবং কোন হিসাবে eventরয়েছে pageX, pageYইত্যাদি ক্রোম, সাফারি, ইন্টারনেট জন্য কাজ করে কিন্তু না মুক্তিযোদ্ধা।


0
var CurrentMouseXPostion;
var CurrentMouseYPostion;

$(document).mousemove(function(event) {
    CurrentMouseXPostion = event.pageX;
    CurrentMouseYPostion = event.pageY;
});

প্রত্যেকটি ফ্রেমকে মাউস সমন্বিত করতে এবং বৈশ্বিক ভেরিয়েবলগুলিতে সেগুলি সঞ্চয় করতে, ডকুমেন্ট অবজেক্টটি, আমার ক্ষেত্রে ডকুমেন্ট অবজেক্টের মূল অবজেক্টে একটি ইভেন্টলিস্টনার করুন এবং এর মতো আপনি যখনই পছন্দ করতে চান সেখানে মাউস ওয়াই ও জেড পড়তে পারেন।


-1

আমি এটি জুড়ে এসেছি, মোটামুটি ভাগ করে নিলে ভাল লাগবে ...

তোমরা কি ভাবো?

$(document).ready(function() {
  window.mousemove = function(e) {
    p = $(e).position();  //remember $(e) - could be any html tag also.. 
    left = e.left;        //retrieving the left position of the div... 
    top = e.top;          //get the top position of the div... 
  }
});

এবং বুম, সেখানে আমাদের আছে ..

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.