JavaScript 中有没有办法将 Shift + Enter 更改为 Enter答案

【问题标题】：Is there a way in JavaScript to change Shift + Enter to just EnterJavaScript 中有没有办法将 Shift + Enter 更改为 Enter
【发布时间】：2019-05-14 21:24:58
【问题描述】：

我正在寻找一种方法，在 contentEditable 中执行“shift + enter”时的操作与仅按“enter”键时相同，它所做的是将内容放入 div 而不是仅添加 br .

我尝试禁用 shift 键，但没有结果 :( 希望你能帮助我

<div class="editableDiv" contentEditable="true"><b>Hello</b> world.</div>

div{
color: green;
}
.editableDiv{
color: salmon;
}

$('.editableDiv').on('keydown', function(event) {
if (event.keyCode == 13 && !event.shiftKey) {
    console.log('pure enter');
} else if (event.keyCode == 13 && event.altKey) {
    console.log('triggered enter');
    $(this).trigger(jQuery.Event("keydown", {
      keyCode: 13,
      altKey: false
    }));
}
});

按“shift + enter”时只需按“enter”键即可触发

【问题讨论】：

我很困惑。上面代码中的altKey 应该是shiftKey 吗？

标签： javascript jquery

【解决方案1】：

假设您有错字并且 altKey 在您的问题中应该是 shiftKey。

你可以这样做：

   $('.editableDiv').on('keydown', function(event) {
    var shiftEnter = event.keyCode == 13 && event.shiftKey;
    var enterOnly = event.keyCode == 13 && !event.shiftKey;
      if (shiftEnter || enterOnly) {
        console.log('triggered enter');
        //Do something here
      }
      else {
        console.log("Some other key pressed");
    });

【讨论】：

【解决方案2】：

所以听起来您希望“Shift+Enter”与“Enter”做同样的事情，对吗？

如果是这样，您可以将您的操作放入一个单独的函数中，并在两种情况下都调用它。例如：

function MyFunctionName () {
  $('.editableDiv').trigger(jQuery.Event("keydown", {
    keyCode: 13,
    shiftKey: false
  }));
}

$('.editableDiv').on('keydown', function(event) {
  if (event.key === 'Enter' && !event.shiftKey) {
    console.log('pure enter');
    MyFunctionName();
  } else if (event.key === 'Enter' && event.shiftKey) {
    console.log('triggered enter');
    MyFunctionName();
  }
}

此外，如果您不需要在用户点击“Shift+Enter”与“Enter”时做任何不同的事情，您可以将代码缩短为：

function MyFunctionName () {
  $('.editableDiv').trigger(jQuery.Event("keydown", {
    keyCode: 13,
    shiftKey: false
  }));
}

$('.editableDiv').on('keydown', function(event) {
   if (event.key === 'Enter') {
    MyFunctionName();
  }
}

在这种情况下，您可能不需要单独函数中的代码。

我编辑了答案以包含更好的比较运算符 ===。更多信息请参见：Which equals operator (== vs ===) should be used in JavaScript comparisons?

另外，使用 key 代替 keyCode，因为根据 https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent，后者已被弃用

【讨论】：