尝试通过将输入框中的最后一个值（字符或单词）与另一个值进行匹配或比较来获取并替换它

Question

我试图弄清楚如何在输入框中获取最后一个值（单词或字符），将它存储在一个变量中，然后如果它具有完全匹配或部分匹配，则从一组值中替换最后一个值。

里面的项目bindname-block由值组成。假设例如我输入文本：

Web开发 anna

Web开发 an

最后的值anna或an应输入框内更换一次我点击了设定值的列表中，有一个对应的或部分匹配是@annaenriquez或有下列文字的任何值anna或者an所以基本上你是不是仅限于一个选择

下面的代码是我一直在尝试解决的正在进行的工作。

    $('#raintool-app').on('click', '.-bindname-inactive', function() {

    

        let name = $(this).text();

        $('.task-label input').select().val(function(i, value) { 

            return value + " " + name;

        });

        $(this).toggleClass('-bindname-inactive -bindname-active');

    });

    $('#raintool-app').on('change', '.select-block', function() {

        // var value = $(this).val();

        let name = $(this).val();

        $('.task-label input').select().val(function(i, value) { 

            return value + " " + name;

        });

        // console.log(value);

      });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="#raintool-app">

<div class="task-label">

    <input type="text" />

</div>

<ul class="bindname-block">

                <li data-name="annaenriquez" class="bindname-pill -name-annaenriquez -bindname-active -display-name">@annaenriquez</li>

            

                <li data-name="conchui" class="bindname-pill -bindname-inactive -name-conchui">@conchui</li>

            

                <li data-name="donelleagudo" class="bindname-pill -bindname-inactive -name-donelleagudo -display-name">@donelleagudo</li>

            

                <li data-name="dwezilmanuel" class="bindname-pill -bindname-inactive -name-dwezilmanuel -display-name">@dwezilmanuel</li>

           

            </ul>

</div>