Question

在我的表单中，我希望允许用户格式化文本并添加列表等（基本的html功能，而不必知道html）。

以粗体按钮为例：

<div class="goBold button">B</div>
<input type="text" name="txtMessage" />
<script>
$(".goBold").click(function() {
    formatText("bold");
});

function formatText(formatType)
{
    var input = $("#txtMessage");
    var text = input.val();
    var ss = input[0].selectionStart;
    var se = input[0].selectionEnd;

    if (formatType == "bold")
    {
        if (ss == se)
        {
            // there's no text in the textbox, so just write in the tags
            input.val(text + "[b][/b]");
        }
        else
        {
            // surround the highlighted text with the tags
            input.val(text.substr(0, ss) + "[b]" + text.substr(ss, se) + "[/b]" + text.substring(se, text.length));
        }
    }
}
</script>

虽然这一切都有效，但是存在一个小问题：

让我们假设这个文本框的文本值是

快速的红狐狸跳过懒惰的棕色狗。这是英语中唯一使用全部26个字母的字母

突出显示all 26 letters字样，单击粗体按钮将文本包装在标签中，但它也会添加选择后存在的文本的第二个副本。

我不确定为什么会这样，有人能提供任何见解吗？

TIA：）

Answer 1

substr需要两个参数 - 开始和长度。您使用第二个参数作为结束位置而不是长度。

text.substr(0, ss) + "[b]" + text.substr(ss, se-ss) + "[/b]" + text.substring(se)

上面的代码将正确定位[b]标签。

或者，substring（而不是substr）接受start和end参数而不是start和length

Answer 2

您应该在任何地方使用substring：

input.val(text.substring(0, ss) + 
          "[b]" + text.substring(ss, se) + "[/b]" + 
          text.substring(se, text.length));

（顺便说一句，你的选择器应该是$("input[name=txtMessage]") - 它没有id）。

将格式标签添加到文本框值

2 个答案: