Question

我正在使用它 http://xoxco.com/projects/code/tagsinput/ 我的标签输入。

但有人知道如何将标签的div设置为只读模式或禁用它吗？

Answer 1

试试这个：

$('#tags').tagsInput({
        'interactive':false
        });

如果要禁用删除'X'。使用以下内容。

$('.tagsinput').find('a').remove();

Answer 2

这应该有效：

$('.tagsinput input').attr('disabled', 'disabled');

要使其可编辑，您可以执行以下操作：

$('.tagsinput input').removeAttr('disabled');

Answer 3

让我跑步：

var tagsinput = $('#id-tagsinput').next();
tagsinput.removeClass('bootstrap-tagsinput');
tagsinput.find("input").remove();
tagsinput.css("padding-bottom", "10px");

或（更好）

var tagsinput = $('#id-tagsinput').next();
$('[data-role="remove"]').remove();
tagsinput.find("input").remove();
tagsinput.css("padding-bottom", "10px");

再见

Answer 4

我将把另一个竞争者丢给这个问题。我不喜欢被接受的答案，因为在禁用后再次启用它并不容易。

我发现了一个简单的方法：使用CSS。

以下CSS可以很好地工作，并且不需要JS或破坏小部件的DOM。

.bootstrap-tagsinput.disabled {
    border: none;
    box-shadow: none;
}
.bootstrap-tagsinput.disabled input {
    display: none;
}
.bootstrap-tagsinput.disabled .badge span[data-role="remove"]{
    display: none;
}

您还可以在禁用时更改徽标颜色：

.bootstrap-tagsinput.disabled .badge {
    background-color: #ccc;
    border: 1px solid #ababab;
}

然后，当您要启用/禁用时，只需从该元素（带有disabled CSS类的元素）的根中添加或删除bootstrap-tagsinput CSS类。

只读或禁用jquery标记

4 个答案: