0

我有一个 javascript 用于在用户单击按钮时标记文本区域中的文本。现在我只让它为一个按钮工作。总共需要能够标记 8 个按钮，但我不想为每个按钮 id 一遍又一遍地重复相同的代码，所以我尝试了一个 for 循环，但这不起作用。我不太清楚为什么。

这些是按钮 ID：edit-button0、edit-button1、edit-button2、...、edit-button8

我在 for 循环中添加了一个警报来检查按钮 ID。

无论我稍后单击哪个按钮，它都会显示按钮 id 是 edit-button8，并且它会添加连接到该按钮的标签。

任何想法为什么这不起作用或我应该如何做。

/*globals document*/
(function ($) {
    "use strict";
    $(document).ready(function () {

            for (i=0;i<8;i++) {

                $("#edit-button"+i).click(function () {
                        alert("#edit-button"+i);
                        var tag = $("#edit-button"+i).attr("value");
                        var id = "protocol"; /* id of textarea */

                        var element  = document.getElementById(id); /* HTML element object */
                        var start    = element.selectionStart;      /* start pos of selection */
                        var end      = element.selectionEnd;        /* end pos of selection */
                        var text     = element.value;           /* whole text */

                        var prefix   = text.substring(0, start);    /* part before selection */
                        var selected = text.substring(start, end);  /* selected text */
                        var suffix   = text.substring(end);         /* part after selection */
                        /* insert tags in selection */
                        selected     = "["+tag+"]" + selected + "[/"+tag+"]";

                        /* update HTML object */
                        element.value      = prefix + selected + suffix; /* selected text */

                        element.selectionStart = start;                      /* new start pos */
                        element.selectionEnd   = start + selected.length;    /* new end pos */


                        return false;
                    });
            }
    });
})(jQuery);
4

1 回答 1

0

您可以给所有按钮一个类.tagButtons，然后.each()在 jQuery 中使用像这样循环它们

$('.tagButtons').each(function(){ 
     $(this).click(function(){


             var tag = $(this).attr("value");
             var id = "protocol"; /* id of textarea */  

             var element  = document.getElementById(id);                         
             var start    = element.selectionStart;     
             var end      = element.selectionEnd;       
             var text     = element.value;                                             
             var prefix   = text.substring(0, start);   
             var selected = text.substring(start, end);                             
             var suffix   = text.substring(end);    
             selected     = "["+tag+"]" + selected + "[/"+tag+"]";                                                    

             element.value      = prefix + selected + suffix;  

             element.selectionStart = start;                                   
             element.selectionEnd   = start + selected.length;    

             return false;

     });
});

编辑 -

作为替代方案并在将来提供帮助，我认为您的代码的问题是您的 for 循环。看一下这个jsFiddle 示例，以显示循环的外观。

于 2012-05-03T10:33:42.857 回答