按 ENTER 时禁用文本区域中的新行

Question

每当有人按 textarea 中的

enter

时，我就会调用一个函数。现在我想在按下

enter

时禁用

new line

或 break。

因此，当按下

shift

+enter 时，new line 应该可以工作。在这种情况下，函数不应该被调用。

这是 jsfiddle 演示： http://jsfiddle.net/bxAe2/14/

Answer 1

试试这个

$("textarea").keydown(function(e){
// Enter was pressed without shift key
if (e.keyCode == 13 && !e.shiftKey)
{
    // prevent default behavior
    e.preventDefault();
}
});

将你的小提琴更新为

$(".Post_Description_Text").keydown(function(e){
if (e.keyCode == 13 && !e.shiftKey)
{
  // prevent default behavior
  e.preventDefault();
  //alert("ok");
  return false;
  }
});

Answer 2

下面的代码是为了防止调整“textarea”的大小，避免在textarea内出现滚动条，并防止按下回车键时进入下一行。

样式.css

textarea {height:200px; width:200px;overflow:hidden;resize: none;}

index.html

<textarea></textarea>

脚本.js

$("textarea").keydown(function(e){
    // Enter pressed
    if (e.keyCode == 13)
    {
        //method to prevent from default behaviour
        e.preventDefault();
    }
});

Answer 3

React：带值和 onChange 事件的文本区域

const PreventTextAreaEnter = () => {
   const [comment, setComment] = useState();

   const handleTextArea = (e) => {
      console.log({e}) // Destructure to get a more accurate log 

      // Return if user presses the enter key
      if(e.nativeEvent.inputType === "insertLineBreak") return;

      setComment(e.target.value);
   };

   return (
    <>
      <textarea value={comment} onChange={ (e) => { handleTextArea(e) } />
    </>
   )
  }

Answer 4

    $(".Post_Description_Text").keypress(function(event) {

      if (event.which == 13) {        

        alert("Function is Called on Enter");

          event.preventDefault(); //Add this line to your code

       }

   });

Answer 5

对于 Angular 用户

虽然有现有的工作解决方案，但如果有人使用 Angular 遇到此问题，您可以使用以下命令禁用新行：

添加

<textarea ng-trim="false" ng-model='your.model' ...

在您的控制器中，添加：

$scope.$watch('your.model', function(newvalue, oldvalue) {
    if (newvalue && newvalue.indexOf('\n') > -1) {
       $scope.your.model = oldvalue;
    }
});

Answer 6

对于 Svelte 用户：

添加

on:keydown

活动：

<textarea on:keydown={(e) => e.key === "Enter" && e.preventDefault()}/>

Answer 7

在 HTML 中使用

input

标签而不是

textArea

标签