পাঠ্য বাক্সে ট্যাব কীটি ক্যাপচার করছে [বন্ধ]


101

আমি Tabচারটি স্পেসে ট্যাব করতে একটি পাঠ্য বাক্সের মধ্যে কীটি ব্যবহার করতে সক্ষম হতে চাই । এটি এখন যেভাবে হয়, ট্যাব কীটি আমার পরবর্তী সংকেতটিতে প্রবেশ করে or

এমন কিছু জাভাস্ক্রিপ্ট রয়েছে যা ইউআই-তে বুদবুদ হওয়ার আগে পাঠ্য বাক্সে ট্যাব কীটি ক্যাপচার করবে?

আমি বুঝতে পারি কিছু ব্রাউজার (যেমন ফায়ারফক্স) এটির অনুমতি নাও দিতে পারে। Shift+ Tab, বা Ctrl+ এর মতো কাস্টম কী-কম্বো সম্পর্কে কীভাবে Q?


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

এই পোস্টটি "মেটা.স্ট্যাকওভারফ্লো ডটকমের সাথে সম্পর্কিত" হিসাবে মডারেটর-পতাকাযুক্ত হয়ে উঠেছে তবে এটি দুই বছরেরও বেশি পুরানো, সুতরাং আমি এটিকে স্থানান্তর করছি না।
রবার্ট হার্ভে

উত্তর:


108

এমনকি যদি আপনি keydown/ keyupইভেন্টটি ক্যাপচার করেন তবে সেগুলি কেবলমাত্র ট্যাব কীটিই জ্বলজ্বল করে, তবুও আপনার ডিফল্ট ক্রিয়াটি প্রতিরোধ করার জন্য ট্যাব ক্রমের পরবর্তী আইটেমটিতে ঘটমান থেকে রোধ করার কিছু উপায় প্রয়োজন।

ফায়ারফক্সে আপনি preventDefault()ইভেন্ট হ্যান্ডলারের কাছে দেওয়া ইভেন্ট অবজেক্টের পদ্ধতিটি কল করতে পারেন । আইই তে, আপনাকে ইভেন্ট হ্যান্ডেল থেকে মিথ্যা ফিরে আসতে হবে। জিকুয়ারি লাইব্রেরিটি preventDefaultতার ইভেন্ট অবজেক্টে এমন একটি পদ্ধতি সরবরাহ করে যা আইই এবং এফএফতে কাজ করে।

<body>
<input type="text" id="myInput">
<script type="text/javascript">
    var myInput = document.getElementById("myInput");
    if(myInput.addEventListener ) {
        myInput.addEventListener('keydown',this.keyHandler,false);
    } else if(myInput.attachEvent ) {
        myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
    }

    function keyHandler(e) {
        var TABKEY = 9;
        if(e.keyCode == TABKEY) {
            this.value += "    ";
            if(e.preventDefault) {
                e.preventDefault();
            }
            return false;
        }
    }
</script>
</body>

4
আমি সবেমাত্র লাইন 4 সংশোধন করেছি, "if (el.attachEvent)" থেকে "if (myInput.attachEvent)"
ফেনটন

লক্ষ্য করুন এই কোডটি কেবল শেষে টিএবি যোগ করবে। এটি বেশিরভাগ ক্ষেত্রে অসুবিধে হয়।
আলেকজান্ডার পালামারচুক

পুনঃটুইটগুলি বন্ধ করে দেওয়ার জন্য সহজ উপায় আছে কি keycode 8?
ইয়াকার্ট

18

আমি বরং ফর্ম আইটেমগুলির মধ্যে ট্যাব ভাঙার চেয়ে ট্যাব ইন্ডেন্টেশন কাজ না করব।

আপনি যদি মার্কডাউন বাক্সে কোড লাগাতে ইন্ডেন্ট করতে চান তবে Ctrl+ K(অথবা একটি ম্যাকের উপর ⌘K) ব্যবহার করুন।

প্রকৃতপক্ষে ক্রিয়া বন্ধ করার শর্তে, আপনি যখন ইভেন্ট কলব্যাক থেকে মিথ্যা প্রত্যাবর্তন করেন তখন jQuery (যা স্ট্যাক ওভারফ্লো ব্যবহার করে) কোনও ঘটনা বুদবুদ হওয়া থেকে বিরত রাখবে। এটি একাধিক ব্রাউজারের সাথে কাজ করার জন্য জীবনকে সহজ করে তোলে।


13

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

document.onkeydown = TabExample;

function TabExample(evt) {
  var evt = (evt) ? evt : ((event) ? event : null);
  var tabKey = 9;
  if(evt.keyCode == tabKey) {
    // do work
  }
}

6

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

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


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

অ্যাক্সেসিবিলিটি সংক্রান্ত প্রভাব সম্পর্কে @ চার্লস খুব ভাল পয়েন্ট।
ওয়ালি ললেস

4

স্কটকুনের সেরা উত্তরে একটি সমস্যা রয়েছে

এই যে এটা

} else if(el.attachEvent ) {
    myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}

হতে হবে

} else if(myInput.attachEvent ) {
    myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}

এই কারণে এটি IE তে কাজ করে নি। আশা করছি যে স্কটকুন কোড আপডেট করবেন


3

ম্যাকের ক্রোমে, আল-ট্যাব কোনও <textarea>ক্ষেত্রে একটি ট্যাব অক্ষর সন্নিবেশ করায় ।

এখানে একটি:। উই!

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