반응형
TEXTAREA에 Ctrl + Enter jQuery
커서가 TEXTAREA 내에 있고 Ctrl+ Enter를 눌렀을 때 어떻게 트리거 합니까? jQuery 사용 . 감사
다음과 같이 event.ctrlKey
플래그를 사용하여 Ctrl키가 눌 렸는지 확인할 수 있습니다 .
$('#textareaId').keydown(function (e) {
if (e.ctrlKey && e.keyCode == 13) {
// Ctrl-Enter pressed
}
});
실제로 이것은 트릭을 수행하고 모든 브라우저에서 작동합니다.
if ((event.keyCode == 10 || event.keyCode == 13) && event.ctrlKey)
js fiddle 링크 .
노트:
- Windows 및 Linux의 Chrome에서는 13이 아닌 10 enter으로 등록됩니다
keyCode
( 버그 보고서 ). 따라서 둘 중 하나를 확인해야합니다. ctrlKey
입니다 control윈도우, 리눅스 및 맥 OS (하지에 command). 을 (를) 참조하십시오metaKey
.
범용 솔루션
이것은 macOS도 지원합니다 : Ctrl+ Enter와 ⌘ Command+ Enter가 모두 허용됩니다.
if ((e.ctrlKey || e.metaKey) && (e.keyCode == 13 || e.keyCode == 10)) {
// do something
}
다른 사람의 답변이 불완전하거나 브라우저 간 호환되지 않는 것을 발견했습니다.
이 코드는 Google 크롬에서 작동합니다.
$(function ()
{
$(document).on("keydown", "#textareaId", function(e)
{
if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey)
{
alert('ctrl+enter');
}
});
});
다음과 같이 간단하지만 유연한 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를 누르면 양식을 제출해야합니다.
( https://stackoverflow.com/a/9964945/1017546 덕분에 )
$('my_text_area').focus(function{ set_focus_flag });
//ctrl on key down set flag
//enter on key down = check focus flag, check ctrl flag
먼저를 Ctrl누를 때 플래그를 설정 해야합니다. onkeydown을 수행합니다. 그런 다음 Enter 키 다운을 확인해야합니다. 에 대한 키업이 표시되면 플래그를 설정 해제하십시오 Ctrl.
게임에 조금 늦었을 수도 있지만 여기에 제가 사용하는 것이 있습니다. 또한 커서의 현재 대상인 양식을 강제로 제출합니다.
$(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();
}
});
참고URL : https://stackoverflow.com/questions/1684196/ctrlenter-jquery-in-textarea
반응형
'Programing' 카테고리의 다른 글
Eclipse에서 JRE의 소스 코드를 보려면 어떻게해야합니까? (0) | 2020.09.23 |
---|---|
구문 나쁜 관행을 만족시키기 위해 return 문이 있습니까? (0) | 2020.09.22 |
appharbor에서 웹 서비스를 빌드 할 때 nuget.exe를 찾을 수 없습니다. (0) | 2020.09.22 |
Ruby on Rails 3 OSX에서 '/tmp/mysql.sock'소켓을 통해 로컬 MySQL 서버에 연결할 수 없습니다. (0) | 2020.09.22 |
org.hibernate.proxy.pojo.javassist.Javassist 클래스에 대한 시리얼 라이저가 없습니까? (0) | 2020.09.22 |