0

大家好，我正在制作一个 BB 代码解析器，但我被困在 JavaScript 前端。我正在使用 jQuery 和插入符号库来记录文本字段中的选择。当有人选择一段文本时，将出现一个带有格式选项的 div。

我有两个问题。
问题 1.我怎样才能使它适用于多个文本字段？我正在画一个空白，因为它目前会正确检测文本字段，直到它进入

$("#BBtoolBox a").mousedown(function() { }

环形。进入后它会开始在我眼中以随机模式列出一个又一个字段。

！！！主要问题 2。我猜这也是问题 1的主要原因。当我按下格式化选项时，它将在第一个动作上起作用，但在之后的动作上不起作用。它不断复制变量parsed。（如果我只保留一个字段，它将永远不会在第二个字段中打印）

问题3如果你发现代码中有什么特别难看的地方，请告诉我如何改进自己。

我感谢我能得到的所有帮助。提前致谢

$(document).ready(function() {
    BBCP();
});

function BBCP(el) {
    if(!el) { el = "textarea"; }
    // Stores the cursor position of selection start

    $(el).mousedown(function(e) {
    coordX = e.pageX;
    coordY = e.pageY;

    // Event of selection finish by using keyboard
    }).keyup(function() {
        BBtoolBox(this, coordX, coordY);

    // Event of selection finish by using mouse
    }).mouseup(function() {
        BBtoolBox(this, coordX, coordY);

    // Event of field unfocus
    }).blur(function() {
        $("#BBtoolBox").hide();

    });

}

function BBtoolBox(el, coordX, coordY) {
    // Variable containing the selected text by Caret
    selection = $(el).caret().text;
    // Ignore the request if no text is selected
    if(selection.length == 0) {
        $("#BBtoolBox").hide();
        return;
    }
    // Print the toolbox
    if(!document.getElementById("BBtoolBox")) {
        $(el).before("<div id=\"BBtoolBox\" style=\"left: "+ ( coordX + 5 ) +"px; top: "+ ( coordY - 30 ) +"px;\"></div>");
        // List of actions
        $("#BBtoolBox").append("<a href=\"#\" onclick=\"return false\"><img src=\"./icons/text_bold.png\" alt=\"B\" title=\"Bold\" /></a>");
        $("#BBtoolBox").append("<a href=\"#\" onclick=\"return false\"><img src=\"./icons/text_italic.png\" alt=\"I\" title=\"Italic\" /></a>");

    } else {
        $("#BBtoolBox").css({'left': (coordX + 3) +'px', 'top': (coordY - 30) +'px'}).show();
    }

    // Parse the text according to the action requsted
    $("#BBtoolBox a").mousedown(function() {
        switch($(this).children(":first").attr("alt"))
        {
            case "B": // bold
                parsed = "[b]"+ selection +"[/b]";
                break;
            case "I": // italic
                parsed = "[i]"+ selection +"[/i]";
                break;
        }

        // Changes the field value by replacing the selection with the variable parsed
        $(el).val($(el).caret().replace(parsed));
        $("#BBtoolBox").hide();
        return false;
    });
}
4

1 回答 1

0

此行：$("#BBtoolBox a").mousedown(function()将函数附加到链接。但是，此行运行多次，每次运行时都会将另一个函数附加到链接，从而为您留下重复的文本。

最佳解决方案是使用插件，例如（我找到的第一个）：http ://urlvars.com/code/example/19/using-jquery-bbcode-editor （演示）

于 2010-04-19T05:27:15.110 回答