如何在文本区域或文本字段中使一些特殊单词为只读

时间:2015-05-02 07:06:28

标签: javascript jquery

我有两个字段。 Textarea和输入类型文本。在这些中有一些标签,如<firstname>,我想让这些用户无法使用。如果他试图删除整个标签将删除。这是Js fiddle

我正在尝试这个

$(function () {
            var tb = $("#t").get(0);
            $("#t").keydown(function (event) {
                var start = tb.selectionStart;
                var end = tb.selectionEnd;
                var reg = new RegExp("(<.+?>)", "g");
                var amatch = null;
                while ((amatch = reg.exec(tb.value)) != null) {
                    var thisMatchStart = amatch.index;
                    var thisMatchEnd = amatch.index + amatch[0].length;
                    if (start <= thisMatchStart && end > thisMatchStart) {
                        event.preventDefault();
                        return false;
                    }
                    else if (start > thisMatchStart && start < thisMatchEnd) {
                        event.preventDefault();
                        return false;
                    }
                }
            });
        });

但它不起作用。

它仅适用于如果标记位于标记的开头,那么它就不可编辑。但是如果标签结束时,那么这是可编辑的。我想让它变得不可能。

1 个答案:

答案 0 :(得分:3)

完成了。我只是在开始和结束选择器上添加+1。它有效。工作链接JSfiddle HTML代码是

<input type="text" class="tag-check" value="<tagname> this is just a check" >
<textarea id="t" class="tag-check" rows=5 cols="80">Hello this is a test <companyname> 

        <lastname> this part is editable <firstname>     

    </textarea>

js代码是

$(function () {


            $(".tag-check").keydown(function (event) {
                var tb = $(this).get(0);
                var start = tb.selectionStart;

                var end = tb.selectionEnd;
                var reg = new RegExp("(<.+?>)", "g");
                var amatch = null;
                while ((amatch = reg.exec(tb.value)) != null) {
                    var thisMatchStart = amatch.index-1;
                    var thisMatchEnd = amatch.index + amatch[0].length+1;
                    if (start <= thisMatchStart && end > thisMatchStart) {
                        event.preventDefault();
                        return false;
                    }
                    else if (start > thisMatchStart && start < thisMatchEnd) {
                        event.preventDefault();
                        return false;
                    }
                }
            });
        });