Textarea类型特殊字符

Question

在textarea中，我希望用户能够按下键盘上的字母并键入𝒜ℬ𝒞𝒟等（因此键入＆ascr;＆bscr;特殊字符）

反正有没有这样做？ 并且让用户可以自由地编辑正常文本区域中的字符。

用户可以单击以选择样式（设置我的var样式整数），字母将是不同的样式，如𝔄𝔅ℭ𝔇（＆Afr;＆Bfr;＆Cfr;等）

我想在最后实现的是用户输入一个段落，然后文本将在textarea中以这种方式显示格式，他们可以在两者之间切换样式。 然后他们将能够复制文本/将其保存为.html文件。

欢迎任何方法！ :)

谢谢！

。

用户可以键入的示例：您好我的名字是Friedpanseller！

textarea可以显示的内容：ℋℯ𝓁𝓁ℴℳ𝓎𝒩𝒶𝓂ℯℐ𝓈𝔉𝔯𝔦𝔢𝔡𝔭𝔞𝔫𝔰𝔢𝔩𝔩𝔢𝔯！

然后用户可以删除中间的一些单词/像普通文本区一样编辑它们

用户可以键入的示例：我的名字是Friedpanseller！

textarea可以显示的内容：ℳ𝓎𝒩𝒶𝓂ℯ𝓈𝒜𝓇ℯ𝔉𝔯𝔦𝔢𝔡𝔭𝔞𝔫𝔰𝔢𝔩𝔩𝔢𝔯！

Answer 1

尝试使用第三方工具（我更喜欢使用CKEditor ），因为它是免费的

Answer 2

这是你可以做的一个例子。 在该文本区域中键入“a”（不带引号）。 它不是很快 ，但它是我能收集到的。 它没有解决您的所有要求，但它是一个开始。

$("textarea").bind("keyup", function() {
    var cursorPosition = $('textarea').prop("selectionStart");
    var text = $(this).val();
    if (text.indexOf('a') > -1) {
        text = text.replace(/a/g, '𝒶');
        $(this).val(text);
        $('textarea').prop("selectionStart", cursorPosition - 1);
        $('textarea').prop("selectionEnd", cursorPosition - 1);
    }
});

您可以尝试将此系统地应用于您要替换的角色 。 祝好运。

Answer 3

当您在空白html中添加代码时，请为jquery事件绑定添加document.ready。

$(document).ready(function(){
$("textarea").bind("keyup", function() {
    var cursorPosition = $('textarea').prop("selectionStart");
    var text = $(this).val();
    if (text.indexOf('a') > -1) {
        text = text.replace(/a/g, '𝒶');
        $(this).val(text);
        $('textarea').prop("selectionStart", cursorPosition - 1);
        $('textarea').prop("selectionEnd", cursorPosition - 1);
    }
});
});

如果我们在单独的HTML页面中使用相同的代码，它就会以这种方式工作。