检测部分 url 模式，然后将其移动到其他字段答案

【问题标题】：Detect partial url pattern, then move it to other field检测部分 url 模式，然后将其移动到其他字段
【发布时间】：2011-06-15 04:12:29
【问题描述】：

我有 2 个 textarea 字段。第一个字段有字符限制。当用户在第一个字段中键入文本时，达到限制后，文本将自动继续到第二个字段。

问题是当用户键入或粘贴 url 时，需要将整个 url 移动到第二个字段。我想使用正则表达式并解析 keyup 事件处理程序中第一个字段中的文本。我要查找的模式是 http://...

有没有人遇到过类似的问题，或者有没有 jquery 插件可以做到这一点？

更新：

假设第一个字段有 15 个字符的限制。用户类型：

'abc '

然后在空格后面粘贴一个链接：http://google.com/?q=test

字段值将变为：

'abc http://google.com/?q=test'

超过 15 个字符。现在脚本会将文本剪切成：

'abc http://goog'

其余的文本将转到第二个字段：

 'le.com/?q=test'

所需的操作应该是将整个 http://google.com/?q=test 移到第二个字段中，将 'abc ' 留在第一个字段中。

我的问题是，你有更好/更有效的方法来实现这个功能，还是有 jquery 库有这个功能？

【问题讨论】：

标签： javascript jquery regex url

【解决方案1】：

我看不出你的问题。大概您将达到字符限制，返回到前一个空白字符（可能是许多字符中的任何一个 - 空格、制表符、回车等）并在那里拆分内容。这应该考虑到 URL，因为它们没有空格。

编辑

下面是我所说的一个简单示例：

<form>
  <textarea id="ta0" style="width: 200px; height 200px;"></textarea>
  <textarea id="ta1" style="width: 200px; height 200px;"></textarea>
  <input type="reset">
</form>
<script type="text/javascript">

function moveWords() {
    var el1 = this;
    var el1full = false;
    var el2 = document.getElementById('ta1');
    var charLimit = 20;
    var word, words;
    var v1 = el1.value;
    var s = '';

    // If gone over character limit
    if (v1.length > charLimit) {
      words = v1.split(/\s+/);

      // Get the value, split into words, add back 
      // one at a time until over limit, then put into
      // next field and change focus
      for (var i=0, iLen = words.length; i<iLen; i++) {
        word = words[i];

        if (!el1full && (s.length + word.length) < charLimit) {
          s += (s == '')? word : ' ' + word;
          len = s.length;
        } else {
          if (!el1full) {
            el1full = true;
            el1.value = s;
            s = '';
          }
          s += (s == '')? word : ' ' + word;
        }
        el2.value = s;
        el2.focus();
      }
    }
}

window.onload = function() {
  document.getElementById('ta0').onkeyup = moveWords;
}

【讨论】：

更新没有改变任何东西。您可能会拆分空格，然后一次添加一个“单词”。如果添加的单词超出限制，请将整个单词放在下一个字段中。或者，如果您想拆分单词而不是 URL，请检查此时是否是 URL，如果不是，则将其拆分，如果是，则将其放在下一个字段中。
谢谢你的例子，RobG。
这个解决方案比我在原始问题中的预期要好。移动整个单词比从中间切开要好。

【解决方案2】：

您可以获取字符串并将其拆分为使用空格作为分隔符的数组。

然后你遍历这些单词并检查它是否比第一个字段长 free 空间：

如果它更长，则检查它是否是 URL：如果是，则直接放入第二个字段，否则将其拆分。
如果不再将单词附加到第一个字段

一旦您将单词的（部分）放入第二个字段，其余单词将直接进入第二个字段。

【讨论】：