JQuery Tokeninput — Добавить новый тег — Выдает, если новый токен является подстрокой любого существующего токена.

Посмотрите на следующий сценарий:

введите описание изображения здесь

Я добавил токен под названием «Facebook». Я хочу добавить новый токен под названием «книга». Если я пишу книгу и нажимаю ввод, она автоматически выбирает facebook вместо добавления нового тега под названием «книга».

Есть ли решение для достижения этой цели?

0

Решение

		$(function(){
var availableTags = [
"actionscript",
"applescript",
"asp",
"basic",
"c",
"c++",
"clojure",
"coldfusion",
"erlang",
"fortran",
"groovy",
"haskell",
"java",
"javascript",
"lisp",
"perl",
"php",
"Python",
"ruby",
"scala",
"scheme"];
$( "#etags" ).autocomplete({
source: availableTags
});$('#tags input').on('focusout',function(){
var txt= this.value.replace(/[^a-zA-Z0-9\+\-\.\#]/g,''); // allowed characters
if(txt) {
var flag = false;
$(".tag").each(function()
{
var id = $(this).attr("id");
if(id == txt)
{
flag = true;
}
});
if(flag)
{
alert("Tag already exist!!")
}
else
{
$(this).before('<span class="tag" id ='+txt+' >'+ txt.toLowerCase() +'</span>');
}}
this.value="";
}).on('keyup',function( e ){
// if: comma,enter (delimit more keyCodes with | pipe)
if(/(188|13)/.test(e.which)) $(this).focusout();

});$('#tags').on('click','.tag',function(){
if(confirm("Really delete this tag?")) $(this).remove();
});

});
		<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<title>Multiple tags Seperated by comma or Enter by Balram Singh</title><div id="tags">
<span class="tag" id="Wordpress">wordpress</span>
<span class="tag" id="c++">c++</span>
<span class="tag" id="jquery">jquery</span>
<input type="text" id="etags"  value="" placeholder="Enter multiple Tags Seperate by comma or Enter " />
</div>
0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]