Question

我正在尝试构建一种智能文本输入框，在用户输入的情况下，'和'被'AND \ n'替换（即每个'和'，'和'被大写并且用户转到新行。）

我用于此的Javascript是：


function Validate()
{
document.getElementById("search").value =  document.getElementById("search").value.replace("and","AND \n"); //new line for AND
}

HTML部分是这样的：

< textarea type="text" name="q" id="search" spellcheck="false" onkeyup='Validate();'>< /textarea>

虽然上述脚本在Firefox和Chrome上运行良好，但在Internet Explorer上却出现了一些行为错误（将光标移到每个'KeyUp'上的文本末尾）。
上述代码也不适用于'和'的其他变体，如'And'，'anD'甚至'AND'本身。

Answer 1

我认为这里的实际答案是前两者的混合：

onkeyup="this.value = this.value.replace(/\band\b/ig, ' AND\n')"

您需要i使搜索不区分大小写，g以确保替换所有匹配项。这不是非常有效，因为它将替换以前的匹配，但它会起作用。

使它成为一个单独的功能：

function validate() {
    document.getElementById('search') = document.getElementById('search').replace(/\band\b/ig, ' AND\n');
}

Answer 2

如果您在用户输入时更改textarea内容，则插入符号将始终移至最后，即使在Firefox和Chrome中也是如此。只是尝试编辑你已经写过的东西，你就会理解我。您必须将插入符移动到用户期望的确切位置，这也意味着您必须检测文本选择（当您有选择时，键入的标准行为将删除所选文本）。

你可以在这里找到一些sample code。您可以使用doGetCaretPosition（），setCaretPosition（）函数。

Answer 3

我尝试解决问题并使用以下javascript解决：

function Validate() {
    if( document.getElementById("search").value.search(/\band$(?!\n)/i) >= 0 ){ // for maintaining cursor position
        document.getElementById("search").value =  document.getElementById("search").value.replace(/\band$(?!\n)/i,"AND\n"); //new line for AND
    }
}

细化上述问题和解决方案：

1）在每个按键上调用该功能，因此在每个按键上重复“AND \ n”，因此在每个按键上插入一个空行。我通过使用正则表达式来避免上述情况：

/\band$(?!\n)/i

\b =喜欢Word（避免S AND ）
$ =行尾（因为“和”将被“AND \ n”替换，因此它将始终为行尾）
(?!\n) =未跟随新行（以防止在每次按键时反复更换“AND \ n”）
i =涵盖“和”的所有变体，包括“和”，“和”等。

2）重新编辑输入时，Internet Explorer行为不正常并且未保持光标位置（移动到结束）。这是由于替换功能引起的（正如上面的Alvaro所暗示的）。
因此，我只在需要时插入一个“if”语句来调用replace函数，即只有当某些“和”需要替换时才会调用它。

感谢大家的帮助。

Answer 4

我认为您希望replace来电看起来像这样：

~~replace(/\band\b/i,"AND \n")~~ （见下文）

这样它不区分大小写（/i），只接受与and匹配的单个单词，因此'sand'和包含'and'的类似单词不匹配，只有'并且'就在它自己。

编辑：我根据评论使用了它，我认为this工作示例是您想要的。

将onKeyUp事件替换为onBlur：

<textarea type="text" name="q" id="search" spellcheck="false" onblur='Validate();'></textarea></body>

这样validate函数仅在用户离开文本框时运行。您也可以运行它onSubmit。

我还在正则表达式中添加了一个全局开关（g）和可选的尾部空格（\s?）：

replace(/\band\b\s?/ig,"AND \n")

这会导致这样的输入：

sand and clay and water

当你离开文本框时

转换成这个：

sand AND
clay AND
water

你可能应该针对更多案例进行测试。

Answer 5

尝试使用以下replace()声明：

replace(/\band(?!$)/ig, "And\n")

因为这是针对改变的字符串重复调用的，所以你必须确保“和”后面没有换行符。

示例（使用循环和函数来模拟用户输入字母）：

function onkeyup() {
     var str = this;
     return this.replace(/\band(?!$)/ig, "And\n");
};

var expected = "this is some sample text And\n is separated by more text And\n stuff";
var text = "this is some sample text and is separated by more text and stuff";
var input = "";
var output = "";

for(var i = 0, len = text.length; i < len; i++ ) {
    input += text.substr(i,1);
    output = onkeyup.call(input);
}

var result = expected == output;
alert(result);
if( !result ) {
   alert("expected: " + expected);
   alert("actual: " + output);
}

你可以在这里测试一下：http://bit.ly/8kWLtr

Answer 6

您需要编写一个在IE和FireFox中运行的JS代码。我认为这就是你所需要的：

var s = document.getElementbyId('Search');
s.value = s.value.replace('and', 'AND \n');

使用Javascript替换文本框中的文本（更改大小写）

6 个答案: