防止用户粘贴换行符答案

【问题标题】：Prevent user from pasting line break防止用户粘贴换行符
【发布时间】：2016-08-10 22:07:53
【问题描述】：

我目前遇到了代码问题。在我的代码中，我有一个文本区域，用户可以在其中输入一篇文章的标题，我希望这篇文章只在一行中。这就是为什么我写了一个脚本来防止用户按回车键。但是他们可以绕过这种安全性，事实上，如果他们复制/越过换行符，他们就可以进入换行符。那么，有没有办法检测换行符？我想我们可以用正则表达式和 \n 或 \n 来做到这一点。但是我试过这个：

var enteredText = $('textarea[name="titleIdea"]').val();
var match = /\r|\n/.exec(enteredText);
if (match) {

    alert('working');
}

并且由于未知原因它不起作用。我认为 var enteredText = $('textarea[name="titleIdea"]').val(); 不起作用，因为当我尝试 alert() 它时，它什么也没显示。但奇怪的是，当我对 $('textarea[name="titleIdea"]').val(); 发出警报时而不是在输入文本变量上显示内容。祝你有美好的一天。（对不起，我是法国人）

【问题讨论】：

您不使用文本字段是否有某些原因？尝试在代码中添加一些 console.log() 语句，看看它在哪里中断： console.log(enteredText); var match = /\r|\n/.exec(enteredText);
@Wes console.log 不是语句，而是函数。
您确实应该根据您期望的数据选择输入类型。 UI 设计的第一条规则是明确您期望的数据类型。与@Wes 一致，您应该使用文本类型的输入字段。文本区域让用户认为多行是可以的。对于选择器，我认为内引号应该是单引号，尽管您总是可以只为元素添加一个 id 并通过 id 选择它。
“但他们可以绕过这种安全性” - 你在客户端所做的一切都远非“安全性”。（甚至假设到达您的脚本的每个请求都必须来自“浏览器”，这太天真了。）在服务器端执行此操作 - 如果数据包含换行符，则拒绝数据，或者自动过滤掉它们。跨度>
@TheProHands 感谢您的澄清 - 我一直认为 console.log() 就像 print_r 声明。但从技术上讲，你是正确的。并不是说它有助于回答这个问题......

标签： javascript jquery

【解决方案1】：

如果他们复制/越过换行符，他们可以输入换行符

这就是为什么您甚至不应该担心阻止他们进入它 - 只是不要保存它。如果您真的想要，请在 blur 和 input 事件中删除它，但真正重要的唯一时间是在您将其保存到数据库（或您正在使用的任何东西）之前。

$('textarea[name="titleIdea"]').on('blur input', function() {
    $(this).val($(this).val().replace(/(\r\n|\n|\r)/gm,""));
});

而且，正如其他人已经提到的，如果他们不能进行换行，那么你不应该使用 textarea。

【讨论】：

好的，谢谢您的回答，这对我很有帮助。我会照你说的做。

【解决方案2】：

我认为您的问题与粘贴事件有关。

如果我猜到这是我的 sn-p：

$(function () {
  $('textarea[name="titleIdea"]').on('paste', function(e) {
    var data;
    
    if (window.clipboardData) { // for IE
      data = window.clipboardData.getData('Text');
    } else {
      data = e.originalEvent.clipboardData.getData('Text');
    }
    
    var match = /\r|\n/.exec(data);
    if (match) {

      alert('working');
      console.log(data);
    }
  })
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<textarea name="titleIdea">

</textarea>

【讨论】：

【解决方案3】：

这需要在后端处理。即使您使用推荐的适当 HTML 输入类型的文本（而不是 textarea），您仍然无法消除返回字符被保存的可能性。

另外两个答案使用 Javascript - 从技术上讲，这是这个问题的领域。但是，这不能用 Javascript 解决！这假设输入将始终来自您创建的表单，并且 JS 函数运行良好。

避免将特定字符插入数据库的唯一方法是在插入数据库之前以后端语言解析和清理数据。

例如，如果您使用的是 PHP，您可以运行一个类似的正则表达式，在它进入处理之前去除 \n\r 字符。

在这种情况下，Javascript 仅有助于用户体验（用户可以看到他们将要保存的内容）。但确保数据完整性的唯一方法是在服务器端对其进行验证。

【讨论】：