التقاط مفتاح TAB في مربع النص [مغلق]

StackOverflow https://stackoverflow.com/questions/3362

  •  08-06-2019
  •  | 
  •  

سؤال

أود أن أكون قادرًا على استخدام فاتورة غير مدفوعة أدخل داخل مربع نص للتبديل بين أربع مسافات.بالطريقة التي هي عليها الآن، يقوم مفتاح Tab بنقل المؤشر إلى الإدخال التالي.

هل هناك بعض جافا سكريبت التي ستلتقط مفتاح Tab في مربع النص قبل أن يصل إلى واجهة المستخدم؟

أفهم بعض المتصفحات (أي.FireFox) قد لا يسمح بذلك.ماذا عن مجموعة المفاتيح المخصصة مثل يحول+فاتورة غير مدفوعة, ، أو كنترول+س?

هل كانت مفيدة؟

المحلول

حتى لو قمت بالتقاط keydown/keyup إذا حدث ذلك، فهذه هي الأحداث الوحيدة التي يتم تشغيلها بواسطة مفتاح علامة التبويب، فلا تزال بحاجة إلى طريقة ما لمنع حدوث الإجراء الافتراضي، وهو الانتقال إلى العنصر التالي في ترتيب علامات التبويب.

في Firefox، يمكنك الاتصال بـ preventDefault() الطريقة على كائن الحدث الذي تم تمريره إلى معالج الحدث الخاص بك.في IE، يجب عليك إرجاع خطأ من مقبض الحدث.توفر مكتبة JQuery preventDefault الأسلوب على كائن الحدث الخاص به الذي يعمل في IE وFF.

<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>

نصائح أخرى

أفضل عدم عمل المسافة البادئة لعلامة التبويب بدلاً من كسر الجدولة بين عناصر النموذج.

إذا كنت تريد وضع مسافة بادئة لوضع التعليمات البرمجية في مربع Markdown، فاستخدم كنترول+ك (أو ⌘K على جهاز Mac).

فيما يتعلق بإيقاف الإجراء فعليًا، فإن jQuery (الذي يستخدمه Stack Overflow) سيوقف الحدث من الظهور عند إرجاع خطأ من رد اتصال الحدث.وهذا يجعل الحياة أسهل للعمل مع متصفحات متعددة.

الإجابة السابقة جيدة، لكنني واحد من هؤلاء الأشخاص الذين يعارضون بشدة خلط السلوك مع العرض التقديمي (وضع JavaScript في HTML الخاص بي) لذا أفضل وضع منطق التعامل مع الأحداث في ملفات JavaScript الخاصة بي.بالإضافة إلى ذلك، لا تقوم كافة المتصفحات بتنفيذ الحدث (أو e) بنفس الطريقة.قد ترغب في إجراء فحص قبل تشغيل أي منطق:

document.onkeydown = TabExample;

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

أنصح بعدم تغيير السلوك الافتراضي للمفتاح.أفعل قدر الإمكان دون لمس الماوس، لذا إذا جعلت مفتاح علامة التبويب الخاص بي لا ينتقل إلى الحقل التالي في النموذج، فسوف أشعر بالغضب الشديد.

ومع ذلك، قد يكون مفتاح الاختصار مفيدًا، خاصة مع كتل التعليمات البرمجية الكبيرة والتداخل.يعد Shift-TAB خيارًا سيئًا لأن ذلك ينقلني عادةً إلى الحقل السابق في النموذج.ربما يكون من الممكن وجود زر جديد في محرر أسلحة الدمار الشامل لإدراج رمز TAB، مع مفتاح اختصار،؟

هناك مشكلة في أفضل إجابة قدمها ScottKoon

هاهو

} 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.على أمل أن يقوم ScottKoon بتحديث الكود

في Chrome على أجهزة Mac، يقوم مفتاح alt-tab بإدراج حرف علامة تبويب في ملف <textarea> مجال.

هنا واحد:.وي!

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top