关于更改功能的Jquery无法正常工作

Question

我的jquery改变功能不起作用。

如何创建更改功能？

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){
    $("select[name='UF_CRM_1520054293']").on('change',function () {

        $("select[name='UF_CRM_1520054676']").empty();

        var selected_type = $(this).val();
        $.ajax({
                url: "//<?echo $_SERVER["SERVER_NAME"];?>/services/request.php",
                dataType: "json",
                type: "POST",
                data: {selected_type : selected_type},
                success: function(data){
                        //alert(JSON.stringify(data));
                        $("select[name='UF_CRM_1520054676']")
                            .append('<option value=' + 0 + '>' +'Select Location' + '</option>');   
                        $.each(data, function(k,v)
                        {
                            $("select[name='UF_CRM_1520054676']")
                                .append('<option value=' + v.ID + '>' + v.LOCATION + '</option>');
                        });
                }
        }); 
    });
});

Fiddle

Answer 1

试试这个

$(document).ready(function(){
$(document).on('change',"select[name='UF_CRM_1520054293']",function () {
$("select[name='UF_CRM_1520054676']").empty();

var selected_type = $(this).val();
$.ajax({

    url: "//<?echo $_SERVER["SERVER_NAME"];?>/services/request.php",
    dataType: "json",
    type: "POST",
    data: {selected_type : selected_type},
    success: function(data){
    //alert(JSON.stringify(data));
    $("select[name='UF_CRM_1520054676']").append('<option value=' + 0 + '>' +'Select Location' + '</option>');  
    $.each(data,function(k,v)
            {
                $("select[name='UF_CRM_1520054676']").append('<option value=' + v.ID + '>' + v.LOCATION + '</option>');
            });


            }
    }); 
});
});

你应该为on函数提供一个选择器。

了解更多信息

http://api.jquery.com/on/

Answer 2

因此，清除选择下拉列表的理想位置是在添加新选项之前插入ajax成功回调。

在您的代码中，您将无法获取select的值，因为您已经清除了它。

$("select[name='UF_CRM_1520054293']").on('change', function() {

  var selected_type = $(this).val();
  $.ajax({

    url: "//<?echo $_SERVER["
    SERVER_NAME "];?>/services/request.php",
    dataType: "json",
    type: "POST",
    data: {
      selected_type: selected_type
    },
    success: function(data) {
      $("select[name='UF_CRM_1520054676']").empty();
      $("select[name='UF_CRM_1520054676']").append('<option value=' + 0 + '>' + 'Select Location' + '</option>');
      $.each(data, function(k, v) {
        $("select[name='UF_CRM_1520054676']").append('<option value=' + v.ID + '>' + v.LOCATION + '</option>');
      });


    }
  });
});