三个下拉事件更改不起作用

Question

我试图在更改第一个下拉列表时填充第二个下拉列表，并在更改第二个下拉列表时填充第三个下拉列表。

这是我的代码：

$("#categories").change(function() {
    var cat = $('#categories').val();
    alert();

    $.ajax({
            method: "POST",
            url: "get_partner.php",
            data: {
                'categlist': cat
            }
        })
        .done(function(data) {
            $("#patner").remove();
            $("#cbselect").prepend(data);

        });

});
$('#patner').change(function() {
    alert();
});

当第一个下拉菜单发生变化时，警报工作正常，但不会发生任何第二次下拉变化的警报。

这是下拉菜单的 HTML：

<div id='cbselect'><select class="input-large m-wrap" tabindex="1" id="categories" name="categlist" >
   <option value="0"> Select Category</option>
</select></div>
<select class="input-large m-wrap" tabindex="1" id="patner" name="patner" >
   <option value="0"> Select Partner</option>
</select>
<select class="input-large m-wrap cbs" tabindex="1" id="outlet" name="outlet" >
   <option value="0"> Select Outlet</option>
</select>

Answer 1

这行得通，这样使用ajax。

$.post(
  'get_partner.php',
  {'categlist': cat},
  function(ret_data){
    $('#patner').html(ret_data); /* Take even the select Partner option from the ajax page */
  }
);

三个下拉事件更改不起作用

Three dropdown event change not working

html

javascript

jquery

drop-down-menu