Question

我有4个Ajax脚本，可根据其他一个选项更新链式下拉列表

  <script type="text/JavaScript">
   //get a reference to the select element

    $select = $('#building');
    //request the JSON data and parse into the select element
    $.ajax({
      url: '/api/get_building/',
      dataType:'JSON',
      success:function(data){
        //clear the current content of the select
        //iterate over the data and append a select option

        $.each(data, function(key, val){
          $select.append('<option value="' + val.id + '">' + val.as_char  + '</option>');
        })
      },
    });

function getunit() {

    //get a reference to the select element
    $select = $('#unit');
    $id_lease = $('#id_lease');
    $id_leaseterm = $('#id_leaseterm');
    //request the JSON data and parse into the select element

    var c_id = ($("select[name='building'] option:selected").attr('value'));
    c_url = "/api/get_unit/"+c_id+"/";

    $.ajax({

      url: c_url,
      dataType:'JSON',
      success:function(data1){
        //clear the current content of the select
        $select.empty();
        $select.append('<option value="-1"> Select unit </option>');
        $.each(data1, function(key, val){
          $select.append('<option value="' + val.id + '">' + val.as_char  + '</option>');
        })
        getlease();
      },

    });

}

function getlease() {

    //get a reference to the select element
    $select = $('#id_lease');
    $id_leaseterm = $('#id_leaseterm');
    //request the JSON data and parse into the select element
    var s_id = ($("select[name='unit'] option:selected").attr('value'));
    s_url = "/api/get_lease/"+s_id+"/";

    $.ajax({
      url: s_url,
      dataType:'JSON',
      success:function(data1){
        //clear the current content of the select
        $select.empty();
        $select.append('<option value="-1"> Select lease</option>');
        //iterate over the data and append a select option

        $.each(data1, function(key, val){
          $select.append('<option value="' + val.id + '">' + val.as_char  + '</option>');
        })
      },

    });

}



function getleaseterm() {

    //get a reference to the select element
    $select = $('#id_leaseterm');
    //request the JSON data and parse into the select element
    var l_id = ($("select[name='lease'] option:selected").attr('value'));
    //var l_id = 13;
    l_url = "/api/get_leaseterm/"+l_id+"/";

    $.ajax({
      url: l_url,
      dataType:'JSON',
      success:function(data1){
        //clear the current content of the select
        $select.empty();
        $select.append('<option value="-1">Select term </option>');
        //iterate over the data and append a select option

        $.each(data1, function(key, val){
          $select.append('<option value="' + val.id + '">' + val.as_char + '</option>');
        })
      },

    });

}
</script>

我的表单中的以下控件正在更新

    <select name="building" id="building" onchange="getunit();">
          <option id="-1">Select building</option>
        </select>



    <select name="unit" id="unit" onchange="getlease();">
          <option id="-1">Select unit</option>
     </select>

   <select class="select" id="id_lease" name="lease">
    <option value="" selected="selected">---------</option>
    </select> 

    <select class="select" id="id_leaseterm" name="leaseterm">
    <option value="" selected="selected"></option>
    </select>

我的问题是，当我更新下拉列表id_lease时，它会有更改调用。（它是从后端自动生成的）

因此，我在脚本

中添加了带有jquery行的这一行

 $("#lease_id").on("change", getleaseterm());

但它给我一个错误404，找不到“get_leaseterm”的值，因为我认为它在页面加载时被触发。并且我的所有脚本都没有加载。

问题在于最后一行。我该如何解决？

Answer 1

正如Pointy指定删除（）有帮助，我正在调用错误的id

最终版本有效：

$("#id_lease").on("change", getleaseterm);

从jquery改变不是做它应该做的事情

1 个答案: