jQuery ফোকাস ইভেন্ট হারাতে

Question

আমি যদি কোনও ইনপুট ক্ষেত্রটি ফোকাস পায় এবং একটি কনটেইনার দেখানোর চেষ্টা করছি এবং - এটিই আসল সমস্যা - ফোকাসটি যদি হারিয়ে যায় তবে ধারকটি আড়াল করুন। JQuery এর ফোকাস জন্য একটি বিপরীত ইভেন্ট আছে?

কিছু উদাহরণ কোড:

<input type="text" value="" name="filter" id="filter"/>

<div id="options">some cool options</div>

<script type="text/javascript">
  $('#options').hide();

  $('#filter').focus(function() {
    $('#options').appear();
  });
</script>

এবং আমি যা করতে চাই তা হ'ল:

$('#filter').focus_lost(function() {
  $('#options').hide();
});

Answer 1

উপাদান ফোকাস হারিয়ে ফেললে আপনার ক্রিয়াকে কল করতে অস্পষ্ট ইভেন্টটি ব্যবহার করুন :

$('#filter').blur(function() {
  $('#options').hide();
});

Comments

যদি ক্রোম অটোয়ের মতো ব্রাউজারটি পাঠ্যবক্সটি পূরণ করে তবে আমি মনে করি না যে এটি ঝাপসা হয়ে উঠবে ()

— পিটা

Answer 2

এটার মত:

$(selector).focusout(function () {
    //Your Code
});

Comments

এই থেকে পার্থক্য কি blur?

— ক্রেগক্স

অস্পষ্ট পদ্ধতিটি যে বস্তুর সাথে সম্পর্কিত তার ফোকাস (অর্থাৎ অ-বর্তমান তৈরি করা) অপসারণ করতে ব্যবহৃত হয়। একটি টেক্সট ক্ষেত্রটি অস্পষ্টতা প্রদান কর্সারটিকে পরবর্তী ক্ষেত্রের দিকে নিয়ে যাবে। একটি উইন্ডোটি অস্পষ্টতা দেওয়া এটিকে অন্য সবার পিছনে ফেলে দেবে। এটি কোনও সংরক্ষিত শব্দ নয় তাই আপনি আপনার নিজের পরিবর্তনশীল বা ব্লার নামক ফাংশনটি ঘোষণা করতে পারেন তবে আপনি যদি এটি করেন তবে আপনি কোন অবজেক্টটি বর্তমান তা নিয়ন্ত্রণ করতে আপনি এই পদ্ধতিটি ব্যবহার করতে পারবেন না।

— সফটওয়্যারআরএম

ফোকাস পদ্ধতিটি যে বস্তুর সাথে সম্পর্কিত তা ফোকাস দেওয়ার জন্য (অর্থাত্ বর্তমান তৈরি করতে) ব্যবহৃত হয়। একটি পাঠ্য ক্ষেত্র দেওয়া ফোকাসকে সেই ক্ষেত্রটিতে কার্সারটি সরানো হবে। একটি উইন্ডো ফোকাস দেওয়া এটিকে অন্য সবার সামনে নিয়ে যাবে। এমন ক্রিয়াগুলি যা ফোকাসযুক্ত তা ব্যবহারের জন্য প্রয়োগ করার জন্য কোনও নির্দিষ্ট অবজেক্ট নির্দিষ্ট করে না। এটি কোনও সংরক্ষিত শব্দ নয় তাই আপনি নিজের ভেরিয়েবল বা ফাংশন নামক ফাংশন ঘোষণা করতে পারেন তবে আপনি যদি এটি করেন তবে আপনি কোন অবজেক্টটি বর্তমান তা নিয়ন্ত্রণ করতে এই পদ্ধতিটি ব্যবহার করতে পারবেন না।

— সফটওয়্যারআরএম

সফ্টওয়্যারএআরএম এর ব্যাখ্যাটি প্রথম পড়ার সময় আমার কাছে খুব একটা তাৎপর্যপূর্ণ হয়নি, তাই আমি jQuery এর ডকুমেন্টেশন পৃষ্ঠায় একটি বিকল্প ব্যাখ্যা পেয়েছি ( api.jquery.com / ফোকাসআউট ) যা আমি ভেবেছিলাম যে অন্যদের পক্ষে সহায়ক হবে: ফোকাসআউট ইভেন্টটি একটি উপাদানকে পাঠানো হয়েছে যখন এটি বা এর অভ্যন্তরের কোনও উপাদান মনোযোগ হারায়। এটি অস্পষ্ট ইভেন্টের থেকে পৃথক যে এটি প্যারেন্ট উপাদানগুলির ফোকাসের ক্ষয় সনাক্তকরণকে সমর্থন করে (অন্য কথায় এটি ইভেন্ট বুদবুদ সমর্থন করে)।

— ব্র্যাড

Answer 3

"অস্পষ্ট" ব্যবহার করুন: http://docs.jquery.com/Events/blur#fn

Answer 4

অস্পষ্ট ইভেন্ট: যখন উপাদান ফোকাস হারায়।

ফোকাসআউট ইভেন্ট: যখন উপাদান বা এর অভ্যন্তরের কোনও উপাদান ফোকাস হারিয়ে ফেলে।

যেহেতু ফিল্টার উপাদানটির ভিতরে কিছুই নেই তাই অস্পষ্ট এবং ফোকাসআউট উভয়ই এই ক্ষেত্রে কাজ করবে।

$(function() {
  $('#filter').blur(function() {
    $('#options').hide();
  });
})

অস্পষ্টতার সাথে জেএসফিডাল: http://jsfiddle.net/yznhb8pc/

$(function() {
  $('#filter').focusout(function() {
    $('#options').hide();
  });
})

ফোকাসআউট সহ জেএসফিডাল: http://jsfiddle.net/yznhb8pc/1/

Answer 5

ক্ষেত্রটি কেন্দ্রীভূত হওয়ার আগে যদি 'কুল বিকল্পগুলি' দৃশ্য থেকে লুকানো থাকে তবে আপনি এটি ডমটিতে রাখার পরিবর্তে এটি জিকুয়ারিতে তৈরি করতে চাইবেন যাতে পর্দা পাঠক ব্যবহার করে যে কেউ অপ্রয়োজনীয় তথ্য দেখতে না পারে। যখন আমাদের এটি দেখার দরকার নেই তখন কেন তাদের এটি শুনতে হবে?

সুতরাং আপনি যেমন ভেরিয়েবল সেটআপ করতে পারেন:

var $coolOptions= $("<div id='options'></div>").text("Some cool options");

এবং তারপরে ফোকাসে অ্যাড (বা প্রিপেন্ড) করুন

$("input[name='input_name']").focus(function() {
    $(this).append($coolOptions);
});

এবং তারপরে ফোকাস শেষ হলে অপসারণ করুন

$("input[name='input_name']").focusout(function() {
    $('#options').remove();
});