JQuery এর সাথে কেন্দ্রীভূত উপাদানটি পাবেন?


345

JQuery ব্যবহার করে, আমি কীভাবে ইনপুট উপাদানটি পেতে পারি যা ক্যারেটের (কার্সার) ফোকাসযুক্ত?

বা অন্য কথায়, কোনও ইনপুটটিতে ক্যারেটের ফোকাস রয়েছে কিনা তা কীভাবে নির্ধারণ করবেন?



সম্ভাব্য অনুরূপ: stackoverflow.com/questions/516152/...
স্যাম Shiles

উত্তর:


740
// Get the focused element:
var $focused = $(':focus');

// No jQuery:
var focused = document.activeElement;

// Does the element have focus:
var hasFocus = $('foo').is(':focus');

// No jQuery:
elem === elem.ownerDocument.activeElement;

কোনটি আপনার ব্যবহার করা উচিত? jQuery ডক্স উদ্ধৃত :

অন্যান্য ছদ্ম-শ্রেণীর নির্বাচকদের মতো (যারা ":" দিয়ে শুরু হয়) তাদের পূর্ববর্তী প্রস্তাব দেওয়া হয়: ট্যাগের নাম বা অন্য কোনও নির্বাচককে কেন্দ্র করে; অন্যথায়, সর্বজনীন নির্বাচক ("*") নিহিত। অন্য কথায়, খালি $(':focus')সমান $('*:focus')। আপনি যদি বর্তমানে ফোকাসযুক্ত উপাদানটির সন্ধান করছেন তবে D (ডকুমেন্ট.একটিভএলিমেন্ট) পুরো ডিওএম ট্রি অনুসন্ধান না করে এটিকে পুনরুদ্ধার করবে।

উত্তরটা হচ্ছে:

document.activeElement

এবং যদি আপনি উপাদানটি মোড়ানো কোনও jQuery অবজেক্ট চান:

$(document.activeElement)

2
তবে অপেক্ষা করুন, আমি ক্যারেটযুক্ত তেহ উপাদানটি কীভাবে পাব?
ডেভ

@dave। "ক্যারেটটি" বলতে কী বোঝ ? দৃষ্টি নিবদ্ধ করা? মাউস এটা আছে?
gdoron মনিকা 22

আমার পরিস্থিতিটি এখানে: আমি যখন কোনও নির্দিষ্ট উপাদানকে ক্লিক করি তখন আমি শেষ ফোকাসযুক্ত ইনপুট পাঠ্য উপাদানটিতে একটি অক্ষর রাখতে চাই। মূলত সেই এলিমেন্টটিতে নির্দিষ্ট উপাদানটি ক্লিক করার আগে শেষ বা ডান ফোকাস ছিল।
ডেভ

1
@dave। এটা করা যায় না। আমি মনে করি কেবল আইই এর এই বৈশিষ্ট্যটি রয়েছে তবে আপনি এখন অন্য একটি প্রশ্ন জিজ্ঞাসা করছেন, আপনার এটি একটি নতুন প্রশ্নে করা উচিত।
gdoron মনিকা 24

3
আমি পছন্দ করি আপনি কীভাবে প্রিফিক্সড ভেরিয়েবলের নামটি ব্যবহার করেছেন $focused, যেমন আমি ধরে নিয়েছি যে আপনি ভারটি বোঝাতে এটি একটি jquery অবজেক্ট। Tyvm।
ভালামাস

36
$( document.activeElement )

JQuery ডকুমেন্টেশনে প্রস্তাবিত হিসাবে পুরো DOM ট্রি অনুসন্ধান না করে এটিকে পুনরুদ্ধার করবে Will


1
ক্যারেট রয়েছে এমন উপাদান কীভাবে পাবেন?
ডেভ

6

আমি ফায়ারফক্স, ক্রোম, আই 9 এবং সাফারি দুটি উপায়ে পরীক্ষা করেছি।

(1)। $(document.activeElement)ফায়ারফক্স, ক্রোম এবং সাফারিতে প্রত্যাশার মতো কাজ করে।

(2)। $(':focus')ফায়ারফক্স এবং সাফারিতে প্রত্যাশা অনুযায়ী কাজ করে।

আমি মাউসটিতে ইনপুট 'নাম' এ চলে এসে কীবোর্ডে এন্টার টিপলাম, তারপরে আমি কেন্দ্রীভূত উপাদানটি পাওয়ার চেষ্টা করেছি।

(1)। $(document.activeElement)ইনপুটটি ফেরত পাঠায়: ফায়ারফক্স, ক্রোম এবং সাফারিতে প্রত্যাশার মতো নাম, তবে এটি ইনপুট দেয়: জমা দিন: আইই 9 এ অ্যাডপাসওয়ার্ড

(2)। $(':focus')ইনপুট ফেরত দেয়: পাঠ্য: ফায়ারফক্স এবং সাফারিতে প্রত্যাশার মতো নাম, তবে IE তে কিছুই নেই

<form action="">
    <div id="block-1" class="border">
        <h4>block-1</h4>
        <input type="text" value="enter name here" name="name"/>            
        <input type="button" value="Add name" name="addName"/>
    </div>
    <div id="block-2" class="border">
        <h4>block-2</h4>
        <input type="text" value="enter password here" name="password"/>            
        <input type="submit" value="Add password" name="addPassword"/>
    </div>
</form>

5

এটা চেষ্টা কর:

$(":focus").each(function() {
    alert("Focused Elem_id = "+ this.id );
});

হ্যাঁ, এই লুপটির কেবলমাত্র একটি পুনরাবৃত্তি থাকবে। সতর্কতা কেবল উদাহরণ দেখানোর জন্য। আপনার যদি এই পরিবর্তনশীল থাকে তবে আপনি যে উপাদানটি চান তা দিয়ে সবকিছু করতে পারেন।
আদিল মালিক

কীভাবে একাধিক উপাদানকে ফোকাস করা সম্ভব?
Andreas Furster

পছন্দ করুন এই লুপটিতে সর্বদা কেবলমাত্র একটি পুনরাবৃত্তি থাকবে। লক্ষ্যটি অর্জনের এটি সেরা উপায় নাও হতে পারে তবে এটি কার্যকর works
আদিল মালিক

এটি কেন সবচেয়ে নিকৃষ্ট / সর্বনিম্ন দক্ষ উপায় তা জানার জন্য গৃহীত উত্তরটি দেখুন। (অপ্রয়োজনীয় .eachঅ-প্রতিরোধী)
ব্র্যাড কেন্ট

2

কীভাবে দুপুরের কথা বলা হয়েছে ..

document.activeElement.id

আমি আই 8 ব্যবহার করছি এবং এটি অন্য কোনও ব্রাউজারে পরীক্ষা করে দেখিনি। আমার ক্ষেত্রে, আমি ক্ষেত্রটি সর্বনিম্ন 4 অক্ষর এবং অভিনয়ের আগে ফোকাস করা হয়েছে তা নিশ্চিত করতে এটি ব্যবহার করছি। আপনি একবার চতুর্থ সংখ্যাটি প্রবেশ করার পরে এটি ট্রিগার হয়ে যায়। ক্ষেত্রটির 'বছরের' আইডি রয়েছে। আমি ব্যাবহার করছি..

if( $('#year').val().length >= 4 && document.activeElement.id == "year" ) {
    // action here
}

1

$(':focus')[0] আপনাকে আসল উপাদান দেবে।

$(':focus') আপনাকে উপাদানগুলির একটি অ্যারে দেবে, সাধারণত একবারে কেবলমাত্র একটি উপাদান কেন্দ্রীভূত থাকে তাই যদি আপনার কোনওরকম একাধিক উপাদান ফোকাস থাকে তবে এটি কেবল ভাল।



0

যদি আপনি নিশ্চিত করতে চান যে ফোকাসটি কোনও উপাদানটির সাথে রয়েছে কিনা

if ($('#inputId').is(':focus')) {
    //your code
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.