wysiwyg中的字符串IndexOf和Replace

String IndexOf and Replace in wysiwyg

本文关键字：Replace IndexOf 字符串 wysiwyg      更新时间：2023-09-26

我正在尝试创建一个非常简单的wysiwyg编辑器（没有颜色），并尝试为其中一个开始标记创建"结束标记"。

我知道当我使用值时，它不会起作用，因为它得到了textarea的全部值，所以我尝试使用string，使用indexOf和replace。

但代码似乎不起作用，我研究了在textarea中搜索特定关键字（假设为<html>），并用另一个（关键字：<html> </html>）替换它

JavaScript

$(document).ready(function() {
    var textarea = document.getElementById('codeTextarea');
    textarea.keyup(function(e) {
        var str = textarea.value;
        if(str.indexOf('<html>') != -1){
            str.replace("<html>", "<html> </html>");
        }
    });
});

HTML

<textarea id="codeTextarea"></textarea>

如何用另一个字符串替换textarea中的特定字符串？（即：<html>将替换为<html> </html>）

注意

请不要告诉我使用值，因为值可以是<doctype> <html>，然后所需的代码就无法工作。

您的代码中有几个错误。第一个是您正在使用普通DOM对象中缺少的jquery.keyup事件。第二个问题是.replace实际上返回了替换的结果。第三个问题是，您没有将该值应用于文本区域。

var textarea = $('#codeTextarea');
textarea.keyup(function(e) {
    var field = $(this);
    var str = field.val();
    if(str.indexOf('<html>') != -1){
        str = str.replace("<html>", "<html> </html>");
    }
    field.val(str);
});

但是，这段代码是有效的，但是您应该重新考虑使用正则表达式。因为一旦您转换<html>到<html><html>下次您将得到<html><html><html>等等。

这是一把小提琴http://jsfiddle.net/ErF4k/1/

这是另一个jsfiddlehttp://jsfiddle.net/ErF4k/3/它使用正则表达式。这不是我最擅长的部分，但我的想法是匹配<html>后面跟着一些不同的东西，然后是一个标签。

var textarea = $('#codeTextarea');
textarea.keyup(function(e) {
    var field = $(this);
    var str = field.val();        
    if(str.indexOf('<html>') != -1){
        str = str.replace(/'<html'>([a-z|A-Z|0-9| ])/g, "<html></html>");
    }
    field.val(str);
});

只需开始键入<html>，然后按字母、数字或间隔。

在替换完字符串中的内容后，您忘记了设置文本区域的值。尝试做：

$(document).ready(function() {
    var textarea = document.getElementById('codeTextarea');
    textarea.keyup(function(e) {
        var str = textarea.value;
        if(str.indexOf('<html>') != -1){
            textarea.value = str.replace("<html>", "<html> </html>");
        }
    });
});
相关文章：