JQuery ব্যবহার করে পৃষ্ঠা লোডের ফর্ম ইনপুট পাঠ্য ক্ষেত্রে কীভাবে ফোকাস করবেন?


238

এটি সম্ভবত খুব সহজ, তবে কেউ কি আমাকে বলতে পারে কীভাবে পৃষ্ঠার লোডের কোনও পাঠ্য বাক্সে কার্সারটি ঝলকানো যায়?


96
আমরা এখানে সাধারণ প্রশ্ন আপত্তি করি না।
ডক করুন

: লিঙ্ক নিচে উপর সোহেল আরিফ থেকে উত্তর দিন চেক করুন stackoverflow.com/questions/18054459/...
সোহেল আরিফ

উত্তর:


379

প্রথম পাঠ্য ক্ষেত্রে ফোকাস সেট করুন:

 $("input:text:visible:first").focus();

এটি প্রথম পাঠ্য ক্ষেত্রটিও করে তবে আপনি [0] কে অন্য সূচকে পরিবর্তন করতে পারেন:

$('input[@type="text"]')[0].focus(); 

অথবা, আপনি আইডি ব্যবহার করতে পারেন:

$("#someTextBox").focus();

2
যদি কোনও কথোপকথন ব্যবহার করা হয় তবে দয়া করে এই উত্তরটি দেখুন যদি উপরের স্ট্যাকওভারফ্লো
ম্যাট ক্যান্টি

1
$('input[type="text"]').get(0).focus(); ... আমার জন্য কাজ করেছে
রাব

91

আপনি এটিরautofocus জন্য এইচটিএমএল 5 ব্যবহার করতে পারেন । আপনার jQuery বা অন্যান্য জাভাস্ক্রিপ্টের দরকার নেই।

<input type="text" name="some_field" autofocus>

নোট করুন এটি IE9 এবং এর চেয়ে কম ক্ষেত্রে কাজ করবে না।


অটোফোকাস IE11 পারেন কাজ করে না stackoverflow.com/questions/34068302/...
বিএ TabNabber

এটি আমার দৃশ্যের জন্য কাজ করে তবে নির্বাচিত উত্তরটি কোনও কারণে হয়নি।
বিষ্ণু ওয়াইএস

27

নিশ্চিত:

<head>
    <script src="jquery-1.3.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("#myTextBox").focus();
        });
    </script>
</head>
<body>
    <input type="text" id="myTextBox">
</body>

2
আমি এইচটিএমএল এলিমেন্টের পরে স্ক্রিপ্ট আনার পরামর্শ দিচ্ছি।
আলী শেখপুর

1
@ অলি শিখপৌর স্ক্রিপ্টটি ডোম রেডি র‌্যাপারের মধ্যে রয়েছে তাই এটি এইচটিএমএল উপাদানটির আগে যে ব্যাপার তা নয়, তবে এটি যেভাবে হওয়া উচিত নয়।
পপনুডলস

22

সকলেই কেন এ জাতীয় সাধারণ জিনিসের জন্য jQuery ব্যবহার করছে।

<body OnLoad="document.myform.mytextfield.focus();">

15
প্রশ্নটি jQuery হিসাবে ট্যাগ করা হয়।
আদর্শ মাদ্রেচা

18

আপনি এটি করার আগে আপনার ব্যবহারকারী ইন্টারফেস সম্পর্কে চিন্তা করুন Think আমি ধরে নিলাম (যদিও এর উত্তরের কোনওটিই এটি বলেনি) আপনি যখন ডকুমেন্টটি jQuery এর ready()ফাংশন ব্যবহার করে লোড করবেন তখন আপনি এটি করছেন । যদি কোনও ডকুমেন্টটি লোড হওয়ার আগে কোনও ব্যবহারকারী যদি ইতিমধ্যে অন্য কোনও উপাদানের দিকে মনোনিবেশ করে থাকেন (যা পুরোপুরি সম্ভব) তবে তাদের ফোকাসটি কেড়ে নেওয়া তাদের পক্ষে অত্যন্ত বিরক্তিকর।

ব্যবহারকারী ইতিমধ্যে কোনও ফর্ম ক্ষেত্রে মনোনিবেশ করেছে এবং তারপরে যদি ফোকাসটি চুরি করে না তা রেকর্ড করতে onfocusআপনার প্রতিটি <input>উপাদানগুলিতে বৈশিষ্ট্য যুক্ত করে এটি পরীক্ষা করতে পারেন:

var anyFieldReceivedFocus = false;

function fieldReceivedFocus() {
    anyFieldReceivedFocus = true;
}

function focusFirstField() {
    if (!anyFieldReceivedFocus) {
        // Do jQuery focus stuff
    }
}


<input type="text" onfocus="fieldReceivedFocus()" name="one">
<input type="text" onfocus="fieldReceivedFocus()" name="two">

2
আপনার দৃষ্টিভঙ্গি কেবল প্রযুক্তিগতভাবেই সঠিক নয়, তবে সম্ভাব্য সেরা ইউএক্সের জন্য আপনার বিবেচনাও দুর্দান্ত। বলিহারি!
ফুলুশো ওলাদিপো

12

এইচটিএমএল:

  <input id="search" size="10" />

JQuery:

$("#search").focus();

1
যদি autofocusএইচটিএমএল 5 ব্যবহার করে থাকেন, তবে কেবল ইনপুট উপাদানটিতে অ্যাট্রিবিউট যুক্ত করবেন?
আদর্শ মাদ্রেচা

কীভাবে সেই বৈশিষ্ট্যটি ব্যবহার করা হয় এবং এর পিতামাতার রূপটি প্রকাশের সাথে সাথেই এটি কী কেন্দ্রিয় উপাদান হয়ে উঠবে?
খোম নাজিদ

8

একটি পুরানো প্রশ্ন bumping জন্য দুঃখিত। আমি গুগলের মাধ্যমে এটি খুঁজে পেয়েছি।

এটি আরও লক্ষণীয় যে এটি একাধিক নির্বাচককে ব্যবহার করা সম্ভব, সুতরাং আপনি কেবল একটি নির্দিষ্ট ধরণের নয়, কোনও ফর্ম উপাদানকে লক্ষ্য করতে পারেন।

যেমন।

$('#myform input,#myform textarea').first().focus();

এটি এটি খুঁজে পাওয়া প্রথম ইনপুট বা টেক্সারিয়াকে ফোকাস করবে এবং অবশ্যই আপনি অন্য নির্বাচকগুলিকেও মিশ্রণটিতে যুক্ত করতে পারেন। Hnady আপনি নির্দিষ্ট উপাদান টাইপ সম্পর্কে প্রথমে কিছু নিশ্চিত হতে না পারলে বা আপনি কিছুটা সাধারণ / পুনঃব্যবহারযোগ্য কিছু চাইলে পারেন n


দুর্দান্ত পরামর্শ @ অ্যান্ড্রু
ডেকে

6

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

<script type="text/javascript">
    $(document).ready(function () {
        $("#fieldID").focus(); 
    });
</script>

3
ডকুমেন্ট লোডে <ইনপুট> এ ফোকাস করার জন্য জিনিসগুলি করা খারাপ উপায়, কেবল autofocusএইচটিএমএল 5 সরবরাহিত বৈশিষ্ট্যটি ব্যবহার করুন
ওভারকোডার



0

$('#myTextBox').focus()একা লাইনটি পাঠ্য বাক্সে কার্সারটি রাখবে না, পরিবর্তে ব্যবহার করুন:

$('#myTextBox:text:visible:first').focus();
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.