Ctrl + Enter jQuery ใน TEXTAREA


92

ฉันจะทริกเกอร์บางสิ่งได้อย่างไรเมื่อเคอร์เซอร์อยู่ในTEXTAREAและกดCtrl+ Enterใช้jQuery ขอบคุณ


คำตอบที่คุณยอมรับไม่ได้ผล โปรดเปลี่ยนคำตอบที่คุณยอมรับ
peterchaula

คำตอบ:


128

คุณสามารถใช้event.ctrlKeyแฟล็กเพื่อดูว่าCtrlมีการกดปุ่มหรือไม่สิ่งนี้:

$('#textareaId').keydown(function (e) {

  if (e.ctrlKey && e.keyCode == 13) {
    // Ctrl-Enter pressed
  }
});

ตรวจสอบข้อมูลดังกล่าวข้างต้นที่นี่


15
สิ่งนี้ใช้ไม่ได้ใน Google Chrome เมื่อ Ctrl + Enter กดรหัสที่สำคัญคือไม่10 13
Znarkus

39
วิธีนี้ใช้ไม่ได้ โซลูชันของ Yarolslav Yakovlev ด้านล่างทำงานได้อย่างถูกต้อง โปรดเปลี่ยนคำตอบที่ยอมรับเพื่อประหยัดเวลาของผู้คน
Phil Ricketts

1
@ ทำซ้ำสภาพแวดล้อมใดที่คุณทดสอบ? มีเอกสารเกี่ยวกับ keyCode 10 หรือไม่
Sanghyun Lee

keyCode 10 ไม่ควรเกิดขึ้นบน Chrome อีกต่อไปโปรดดูbugs.chromium.org/p/chromium/issues/detail?id=79407
swissspidy

เมื่อkeypressเหตุการณ์ทริกเกอร์รหัสจะเป็น 10 แต่keydownหรือkeyupจะรายงาน 13 เท่านั้นทดสอบ chrome
iulo

137

อันที่จริงนี่เป็นเคล็ดลับและใช้ได้กับทุกเบราว์เซอร์:

if ((event.keyCode == 10 || event.keyCode == 13) && event.ctrlKey)

เชื่อมโยงไปยังซอ js

หมายเหตุ:

  • ใน Chrome บน Windows และ Linux enterจะลงทะเบียนเป็นkeyCode10 ไม่ใช่ 13 ( รายงานข้อบกพร่อง ) ดังนั้นเราต้องตรวจสอบอย่างใดอย่างหนึ่ง
  • ctrlKeyอยู่controlบน Windows, Linux และ macOS (ไม่ใช่command) metaKeyดูเพิ่มเติม

ซอใช้ไม่ได้ใน Firefox 27 มีอะไรผิดปกติ?
CodeManX

4
@Yaroslav: คุณช่วยบอกได้ไหมว่าการใช้ "event.keyCode == 10" ในคำตอบของคุณคืออะไร
Shashank.gupta40

3
ถ้าใครยังสงสัยเกี่ยวกับ keyCode 10 โครเมี่ยมและสิ่งอื่น ๆ ที่อ่านนี้
user2422869

1
@YaroslavYakovlev ctrlKeyสอดคล้องกับปุ่ม Command บน Macs หรือไม่?
Jacob Stamm

2
เพื่อสนับสนุน Mac ด้วย:if ((e.keyCode == 10 || e.keyCode == 13) && (e.ctrlKey || e.metaKey))
Ilya Manyahin

82

โซลูชันสากล

รองรับ macOS ด้วย: ทั้งCtrl+ Enterและ⌘ Command+ Enterจะได้รับการยอมรับ

if ((e.ctrlKey || e.metaKey) && (e.keyCode == 13 || e.keyCode == 10)) {
    // do something
}

15
อย่าเพิกเฉยต่อคำตอบนี้เพราะมีคะแนนต่ำกว่าเป็นเพียงคำตอบใหม่ซึ่งดีกว่าจริง
David Bell

1
คำอธิบายของส่วนแรก: บน MacOS, e.ctrlKeyตรวจจับ⌃ Controlและตรวจจับe.metaKey ⌘ Commandใช้สิ่งนี้หากคุณต้องการให้ทั้ง Ctrl-Enter และ Command-Enter ทริกเกอร์ลักษณะการทำงาน
Rory O'Kane

คุณสามารถอธิบายได้ว่าทำไมคุณยอมรับe.keyCodeของ10หมายถึงใส่ในนอกเหนือไป13? MDN keyCodeเอกสารรายการเท่านั้น13เป็นค่าที่เป็นไปได้สำหรับใส่ทดสอบเบราว์เซอร์และระบบปฏิบัติการ
Rory O'Kane

1
@ RoryO'Kane Chrome บางเวอร์ชันบน Windows และ Linux ใช้ค่า 10 อย่างเห็นได้ชัด
Flimm

4

ฉันพบคำตอบของผู้อื่นทั้งที่ไม่สมบูรณ์หรือไม่สามารถใช้งานข้ามเบราว์เซอร์ได้

รหัสนี้ใช้ได้กับ google chrome

$(function ()
{
    $(document).on("keydown", "#textareaId", function(e)
    {
        if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey)
        {
            alert('ctrl+enter');
        }
    });
});

2
คุณช่วยพิจารณาปรับปรุงคำตอบโดยเพิ่มคำอธิบายเพิ่มเติมได้ไหม ขอบคุณ :) มิฉะนั้นนี่จะเป็นเพียงคำตอบคุณภาพต่ำสำหรับคำถามคุณภาพต่ำ
Theolodis

@Valamas: คุณช่วยบอกได้ไหมว่าการใช้ "event.keyCode == 10" ในคำตอบของคุณคืออะไร
Shashank.gupta40

1
ฉันชอบคำตอบของ copy & paster
Dr. Max Völkel

2

สิ่งนี้สามารถขยายเป็นปลั๊กอิน JQuery ที่เรียบง่าย แต่ยืดหยุ่นได้ดังต่อไปนี้:

$.fn.enterKey = function (fnc, mod) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if ((keycode == '13' || keycode == '10') && (!mod || ev[mod + 'Key'])) {
                fnc.call(this, ev);
            }
        })
    })
}

ด้วยประการฉะนี้

$('textarea').enterKey(function() {$(this).closest('form').submit(); }, 'ctrl')

ควรส่งแบบฟอร์มเมื่อผู้ใช้กด ctrl-enter โดยเน้นที่ textarea ของฟอร์มนั้น

(ขอบคุณhttps://stackoverflow.com/a/9964945/1017546 )



0

ก่อนอื่นคุณต้องตั้งค่าสถานะเมื่อCtrlถูกกดให้ทำเช่นนี้เมื่อกดคีย์ลง จากนั้นคุณต้องตรวจสอบคีย์ดาวน์ของ Enter ล้างค่าธงเมื่อคุณเห็น keyup Ctrlสำหรับ


0

อาจจะช้าไปหน่อยสำหรับเกม แต่นี่คือสิ่งที่ฉันใช้ นอกจากนี้ยังบังคับให้ส่งแบบฟอร์มที่เป็นเป้าหมายปัจจุบันของเคอร์เซอร์

$(document.body).keypress(function (e) {
    var $el = $(e.target);
    if (e.ctrlKey && e.keyCode == 10) {
        $el.parents('form').submit();
    } else if (e.ctrlKey && e.keyCode == 13) {
        $el.parents('form').submit();
    }
});

คุณสามารถลดความซับซ้อนของ“ ifelse if” ให้เป็นซิงเกิลif (e.ctrlKey && (e.keyCode == 10 || e.keyCode == 13))ได้
Rory O'Kane
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.