การจับคีย์ TAB ในกล่องข้อความ [ปิด]

Question 1

คำถามนี้ไม่น่าจะช่วยผู้เยี่ยมชมในอนาคตได้ มีความเกี่ยวข้องกับพื้นที่ทางภูมิศาสตร์ขนาดเล็กช่วงเวลาที่เฉพาะเจาะจงหรือสถานการณ์ที่แคบเป็นพิเศษซึ่งโดยทั่วไปไม่สามารถใช้ได้กับผู้ชมอินเทอร์เน็ตทั่วโลก สำหรับความช่วยเหลือในการทำคำถามนี้มากขึ้นบังคับในวงกว้างไปที่ศูนย์ช่วยเหลือ

ปิดให้บริการใน9 ปีที่ผ่านมา

ฉันต้องการที่จะสามารถใช้Tabคีย์ภายในกล่องข้อความเพื่อแท็บเกินสี่ช่องว่าง อย่างที่เป็นอยู่ในตอนนี้ปุ่ม Tab จะกระโดดเคอร์เซอร์ไปที่อินพุตถัดไป

มี JavaScript บางตัวที่จะจับคีย์ Tab ในกล่องข้อความก่อนที่จะขึ้นสู่ UI หรือไม่?

ฉันเข้าใจว่าเบราว์เซอร์บางตัว (เช่น FireFox) อาจไม่อนุญาตสิ่งนี้ แล้วคีย์คอมโบที่กำหนดเองเช่นShift+ TabหรือCtrl+ Qล่ะ?

Question 2

แม้ว่าคุณจะจับภาพ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>

Question 3

ฉันอยากให้การเยื้องแท็บไม่ได้ผลดีกว่าการแบ่งแท็บระหว่างไอเท็มฟอร์ม

หากคุณต้องการเยื้องเพื่อใส่โค้ดในกล่อง Markdown ให้ใช้Ctrl+ K(หรือ⌘Kบน Mac)

ในแง่ของการหยุดการกระทำจริงๆ jQuery (ซึ่ง Stack Overflow ใช้) จะหยุดเหตุการณ์ไม่ให้เดือดเมื่อคุณส่งคืนเท็จจากการเรียกกลับเหตุการณ์ สิ่งนี้ทำให้ชีวิตง่ายขึ้นในการทำงานกับเบราว์เซอร์หลายตัว

Question 4

คำตอบก่อนหน้านี้ใช้ได้ แต่ฉันเป็นหนึ่งในคนเหล่านั้นที่ต่อต้านการผสมผสานพฤติกรรมกับการนำเสนอ (ใส่ JavaScript ใน HTML ของฉัน) ดังนั้นฉันจึงชอบใส่ตรรกะการจัดการเหตุการณ์ในไฟล์ JavaScript ของฉัน นอกจากนี้ไม่ใช่ทุกเบราว์เซอร์ที่ใช้ event (หรือ e) ในลักษณะเดียวกัน คุณอาจต้องการตรวจสอบก่อนเรียกใช้ตรรกะใด ๆ :

document.onkeydown = TabExample;

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

Question 5

ฉันขอแนะนำไม่ให้เปลี่ยนพฤติกรรมเริ่มต้นของคีย์ ฉันทำเท่าที่ทำได้โดยไม่ต้องแตะเมาส์ดังนั้นหากคุณทำให้แป้นแท็บของฉันไม่ย้ายไปยังฟิลด์ถัดไปในแบบฟอร์มฉันจะแย่ลงมาก

อย่างไรก็ตามปุ่มทางลัดอาจมีประโยชน์โดยเฉพาะอย่างยิ่งกับบล็อกโค้ดขนาดใหญ่และการซ้อนกัน Shift-TAB เป็นตัวเลือกที่ไม่ดีเพราะปกติจะพาฉันไปที่ฟิลด์ก่อนหน้าในแบบฟอร์ม บางทีปุ่มใหม่บนตัวแก้ไข WMD เพื่อแทรกโค้ด - แท็บด้วยปุ่มทางลัดจะเป็นไปได้หรือไม่?

Question 6

มีปัญหาในคำตอบที่ดีที่สุดที่ให้โดย 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 จะอัปเดตโค้ด

Question 7

ใน Chrome บน Mac แท็บ alt จะแทรกอักขระแท็บลงใน<textarea>ฟิลด์

นี่คือหนึ่ง:. จิ๊ด!