如何检查什么是相邻字符

How to check what are adjacent characters?

本文关键字：字符 什么 何检查 检查      更新时间：2023-09-26

我正在创建一个降价编辑器，我需要检查相邻字符是否是特定字符，然后删除它们，否则附加它们。

例如，我想检查所选文本，拖曳相邻字符**，然后删除它们，否则将它们附加到所选文本周围。

我可以使用此方法获取选定的文本：

function getSelection(elem) {
    var selectedText;
    if (document.selection != undefined) { // IE
        elem.focus();
        var sel = document.selection.createRange();
        selectedText = sel.text;
    } else if (elem.selectionStart != undefined) { // Firefox
        var startPos = elem.selectionStart;
        var endPos   = elem.selectionEnd;
        selectedText = elem.value.substring(startPos, endPos)
    }
    return selectedText;
}
$(document).on('mousedown', 'button', function(e) {
  var selection =  getSelection( $('#txtarea').get(0) );
  alert(selection);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="txtarea">this is a test</textarea>
<button>Bold (toggle)</button>

现在我需要当用户单击该按钮时，它会检查所选文本是否在**之间，就像这样**selectedtext**，然后像这样删除它们selected text否则像这样附加它们**selectedtext**。我该怎么做？

在此之前，

我想参考所有的降价编辑器：https://www.google.de/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=javascript%20markdown%20library

所以：不要试图重新发明轮子，等等。

但为了学习，我的方法看起来像这样：

function toggleMarker(marker, el) {
var markerLength = marker.length;
var startPos, endPos, selection, range;
if (document.selection != undefined) { // IE
    el.focus();
    range = document.selection.createRange();
    selection = range.text;
} else if (el.selectionStart != undefined) { // Firefox
    startPos = el.selectionStart;
    endPos   = el.selectionEnd;
    selection = el.value.substring(startPos, endPos);
}
if (!selection.length){
        return;
}

if (el.value.substring(startPos-markerLength,startPos) === marker
        && el.value.substring(endPos,endPos+markerLength) === marker
){
        el.value = el.value.substring(0,startPos-markerLength) +
                            selection + 
              el.value.substring(endPos+markerLength);
}
else{
        el.value = el.value.substring(0,startPos) + marker + 
                            selection + marker + el.value.substring(endPos);
}
}
$(document).on('mousedown', 'button', function(e) {
  toggleMarker( $(this).data('marker'), $('#txtarea').get(0) ).text;
});

查看实际操作：https://jsfiddle.net/t4ro53v8/4/

该解决方案采用非常通用的方法：将要切换的标记设置为自定义数据属性，以便于重用代码。

该功能仅适用于非 IE 情况。您必须检查如何确定IE中某个范围的startPos和endPos。

在所有其他浏览器中：

  1. 所选内容已确定
  2. 如果未选择任何内容，则不执行任何操作
  3. 根据给定的标记检查所选内容的四舍五入
  4. 如果两个标记都存在，它们将被删除
  5. 否则插入标记

作为概念证明，此示例就像一个魅力。但也有一些缺点：

  • 如何区分粗体文本（**）和斜体（*）？
  • 如何处理仅出现在所选内容一侧的标记
  • 如果选择了标记，该怎么办？

但这是由你现在解决的...

您可以使用正则表达式来查找 ** ** 模式的出现。此正则表达式将帮助您找到与您拥有的模式相似的模式。

[*][*][a-z]*[*][*] .

使用 exec() 方法将帮助您提取该特定文本。

使用 .length 检查它的长度，如果是 4，则中间没有任何东西，您可以将其替换为**包围的新文本，

"**"+ newtext+"**"

要删除 **，您可以使用 replace() 方法，将**替换为空格左右。

相关文章：