django forms中的input组件 输入文字时，下方弹出与之相匹配的数据列表 怎么用代码实现

在 Django Forms 中实现输入框自动提示列表的方法如下：

1. 使用 Ajax 和 jQuery 实现向服务器发送请求并获取返回的 JSON 数据列表。
2. 在 Django 表单中使用 widgets 属性将文本框指定为 TextInput。
3. 在 JavaScript 代码中，监听文本输入事件，并在每次输入时发送 Ajax 请求并更新提示列表。

代码实现如下：

forms.py：

from django import forms

class MyForm(forms.Form):
    username = forms.CharField(widget=forms.TextInput(attrs={'class': 'form-control', 'placeholder': 'Username'}))

template：

{% block js %}
  <script>
    $(function () {
      $('input[name="username"]').on('input', function () {
        var inputVal = $(this).val();
        $.ajax({
          url: "{% url 'suggest' %}?q=" + inputVal,
          type: 'GET',
          dataType: 'json',
          success: function (data) {
            var $suggestList = $('#suggest-list');
            $suggestList.empty();
            data.forEach(function (item) {
              $suggestList.append('<li>' + item + '</li>');
            });
          }
        });
      });
    });
  </script>
{% endblock %}

{% block content %}
  <form method="post">
    {% csrf_token %}
    {{ form.username }}
  </form>

  <ul id="suggest-list"></ul>
{% endblock %}

views.py：

from django.http import JsonResponse
from django.views.decorators.csrf import csrf_exempt
import json

@csrf_exempt
def suggestion(request):
    q = request.GET.get('q', '')
    data = [i for i in ['foo', 'bar', 'baz'] if q.lower() in i.lower()]
    return JsonResponse(data, safe=False)

urls.py：

from django.urls import path
from .views import suggestion

urlpatterns = [
    path('', views.index, name='index'),
    path('suggest/', suggestion, name='suggest'),
]

这样，我们就能实现在 Django 表单中使用输入框自动提示列表了！