JQuery автозаполнение нескольких входов, каждый с уникальным массивом

Question

Я заметил, что этот вопрос задавался для нескольких полей ввода, но как насчет того, когда каждое поле ввода должно иметь уникальный массив слов?

Я пытаюсь использовать плагин jQuery Autocomplete, чтобы прикрепить функцию кнесколько входов, каждый с уникальным массивом слов.Этот массив заполняется из текста в соседнем входе в пределах локального диапазона.Каждый диапазон имеет вход с различными значениями для заполнения массива и вход для автозаполнения.Функция использует только последний заполненный массив вместо текущего автозаполнения, назначенного для.

Это выводимый html:

<?php
            foreach($caseanswers as $key=>$answer){
                    if($answer['input_req']===$term['input_req']){

                            echo '<span class="answer">
                            <textarea class="answertext" id="answer'.$answer['id'].'" disabled>'.$answer['answer'].'</textarea>
                            <div class="ui-widget"><textarea class="autocomplete"></textarea></div>
                            <br/><input type="button" onclick=RUDanswer(this) value="Edit"><input type="button"onclick=RUDanswer(this) value="Delete"></span><br/>';
                    }
            }

?>

Это код jQuery (он уже находится вобертка jquery, не указана)

<script>
$(".autocomplete").each(function(){
            //alert($(this).val());
            acompletebox=$(this);

            function split(val){
                    return val.split(/\s/);
            }
            function extractLast(term){
                    return split(term).pop();
            }

            availableTags=acompletebox.parents('span.answer').find('.answertext').val().split(" ");
//              acompletebox.parents('span.answer').find('.answertext').val().split(" ");
//              console.log(availableTags);
            // don't navigate away from the field on tab when selecting an item
            $(this).on("keydown", function(event){
                    if(event.keyCode===$.ui.keyCode.TAB && $(this).autocomplete("instance").menu.active){
                            event.preventDefault();
                    }
            })
            $(this).autocomplete({
//                availableTags=acompletebox.parents('span.answer').find('.answertext').val().split(" ");

                    minLength: 3, source: function(request, response){
                    //delegate back to autocomplete, but extract the last term
                            response($.ui.autocomplete.filter(availableTags, extractLast(request.term)));
                    },
                    focus:function(){
                    //prevent value inserted on focus
                            return false;
                    },
                    select:function(event, ui){
                            var terms=split(this.value);
                            //remove the current input
                            terms.pop();
                            //add the selected item
                            terms.push(ui.item.value);
                            //add placeholder to get the comma-and-space at the end
                            terms.push("");
                            this.value=terms.join(" ");
                            return false;
                    }
            });
    });
</script>

Наверное, вопрос в том, как мне назначить источник данных автозаполнения с уникальным массивом для каждого ввода?
Спасибо за помощь, которую вы понимаете, хобби-программисты!

Answer 1

Хотя и не идеально, функцию .each () можно заменить на .focus или другую функцию выбора.Он должен перекомпилировать список при каждом наведении, что может быть дорогостоящим в вычислительном отношении, если данные поступают из внешнего источника, однако он работает с этим простым изменением.