Javascript 引导标记输入-值不'；不要从标签中删除

每当单击

x

按钮时，我试图手动从

bootstrap tags input

中删除输入值，但值既不会从数组中得到更改，也不会从输入中得到更改

这是我尝试过的代码：

$（'input'）.tagsinput({
allowDuplicates:true
});
//单击“删除”按钮
$（文档）。在（“单击“，”。标签信息span[data role=remove]”，函数（）上{
//移除该spn
var to_remove=$（this）.clone（）.children（）.remove（）.end（）.text（）.trim（）
console.log（$（“[name=tags]”）.val（）
//如果我把它放在这里的话，`也不行
变量值=$（“[name=tags]”）.val（）.split（“；”）
log（“删除----”+删除）
$（this）.closest（“.label info”）.remove（）
console.log（“输入框值--“+$（“[name=tags]”）和“.val（））
对于（变量i=0；i
。标签信息{
背景色：#17a2b8；
}

来自第133行：

// register item in internal array and map
  self.itemsArray.push(item);

这意味着您输入到文本框中的值将保存到一个内部对象中，您将其视为标记输入。如果更改输入框的值而不更改内部对象，则不会同步文本和内部对象。这样就不会删除任何值。此外，文本框是隐藏的，您可以看到并使用div进行操作

而是通过以下方式获取值：

var values = $("[name=tags]").val().split(';')

您可以使用tagsinput数据对象的itemsArray属性：

var values = $("[name=tags]").data('tagsinput').itemsArray;

现在您可以直接使用此阵列

要删除元素，您可以使用它来代替for循环：

var idx = $(this).closest(".label-info").index();
values.splice(idx, 1);

片段：


$（'input'）.tagsinput({
allowDuplicates:true
});
//单击“删除”按钮
$（文档）。在（“单击“，”。标签信息span[data role=remove]”上，函数（）{
var值=$（“[name=tags]”）。数据（'tagsinput'）。itemsArray；
console.log（值）；
log（“输入框值--“+$（“[name=tags]”）和.val（））；
//同步内部对象和输入文本
var idx=$（this）.closest（“.label info”）.index（）；
拼接值（idx，1）；
$（“[name=tags]”）.val（值）；
//移除该spn
$（this）.closest（“.label info”）.remove（）；
log（“拼接后--”+值）
console.log（“在设置新值之后--“+$（“[name=tags]”）val（））
})
$（'input'）。在（'beforeItemRemove'，函数（e）上{
e、 cancel=true；//将cancel设置为false。。
});
。标签信息{
背景色：#17a2b8；
}
您在for循环中写入return。它具有退出功能。所以有些代码无法执行。
在拆分（“；”）时的第一个代码中，字符串没有“；”，因此不会拆分。
因此，for循环中的
值[i]==to_remove
永远不会为真，因此不会执行return。使用break退出循环。如果不是所有相同的值都将被删除


$（'input'）.tagsinput({
allowDuplicates:true
});
//单击“删除”按钮
$（文档）。在（“单击“，”。标签信息span[data role=remove]”，函数（）上{
//移除该spn
var to_remove=$（this）.clone（）.children（）.remove（）.end（）.text（）.trim（）
var valuesString=$（“[name=tags]”）。val（）；
console.log（valuesString）；
var values=valuesString.split（'，'）；
log（“删除之前----”+值）
log（“删除----”+删除）
$（this）.closest（“.label info”）.remove（）
console.log（“输入框值--“+$（“[name=tags]”）和“.val（））
var i=$（this）.closest（“.label info”）.index（）；
值。拼接（i，1）；
//对于（变量i=0；i
。标签信息{
背景色：#17a2b8；
}

非常感谢：）。但是，您能解释一下为什么上面的代码不起作用吗？您的代码不起作用，因为所有数据都保存在输入字段的数据集“tagsinput”中。您需要使用api，或者可以对数据集进行操作。原因不是“tagsinput”。因为您在“for循环”中写入了return。使用“break”。然后你应该使用break。如果不在for循环中，它将删除相同的值。例如，如果“InputAG”的值为“aaa，aaa，aaa，aaa”，则拼接后的值将为“aaa，aaa”。。。。。。原因不是“标记输入”，你确定吗？请参阅我对代码的注释，主要是如果要删除send元素而不是第一个元素，会发生什么？用break只移除第一个。。。。。。。您也可以像我建议的那样阅读源代码。为什么返回for循环。它具有退出功能。如果要退出for循环，应该使用break。请检查我的答案。删除然后更新数据[tagsinput]后为真。但源代码不执行的原因是因为写入返回for循环。请尝试输入a，然后输入b，删除b，添加a，添加a，然后在控制台中查看。。。。。。。。。。这并不难。对于返回，我向您解释了原因和发生的情况：休息时，您只移除第一个，而从不移除正确的一个是的。对不起。我更新我的代码。我的意思是源代码没有执行，因为返回for循环。