javascript - 当我的下拉列表的值发生变化时,如何触发 Javascript/AJAX 代码?

标签 javascript jquery ajax dropdown

我有一个 Django 项目,当下拉列表更改值时,我尝试运行 JS/AJAX 脚本。相同的代码适用于按钮,但不适用于下拉菜单。

这里是带有按钮、下拉菜单和脚本的 html 代码:

  <button class="toChange">AJAX POST TEST</button>

  <select class="toChange">
    {% for item in regions %}
    <option val="{{ item }}" {% ifequal item reg %} selected {% endifequal %}> {{ item }} </option>    
    {% endfor %}
  </select>

  <script type="text/javascript">
       $(".toChange").click(function(){
        $.ajax({
            type: 'POST', 
        }); 
    });

编辑1:添加views.py并修改我的下拉列表以正确反射(reflect)它,因为我可能过度简化了我的示例。

def MyView(request):
    result_r = request.POST.get('reg')

    if request.method == 'POST' and request.is_ajax:

        result_r = request.POST.get('reg')
        query_results = data_immo.objects.all()
        regions = data_immo.objects.values_list("nom_reg", flat=True).distinct().order_by('nom_reg')
        departements = data_immo.objects.values_list("insee_dep").filter(Q(nom_reg=result_r)).distinct()

        query_results_dict = {
        'query_results': query_results,
        'regions': regions,
        'departements': departements,
        'reg': result_r
        }

        return render(request,'home.html', query_results_dict)

为什么它适用于按钮而不是下拉菜单?我对此真的很陌生,所以请弄清楚哪里出了问题。谢谢!

最佳答案

您需要使用change <select> 情况下的事件

$(".toChange").on('change', function(){ ... })

关于javascript - 当我的下拉列表的值发生变化时,如何触发 Javascript/AJAX 代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60569052/

相关文章:

javascript - $(document).ready() 内的 div 高度为零

JavaScript:附加到多个类

javascript 有条件地禁用按钮

jquery - 无法在同一页面上显示多个 jPicker 颜色选择器

javascript - Laravel 站点不在外部 javascript 文件中使用 Ajax

c# - "filter"是 Angular、Javascript 还是 ASP.Net MVC 中的保留字?

javascript - 使用 .innerHTML 将 <div> 替换为另一个 html 页面?

javascript - 如何使用带按钮的 Notify.js?

JavaScript - 将 JavaScript 与 HTML 连接起来

javascript - 通过 Ajax 正确重新加载 div - 脚本消失