jQuery 前段 指定值修改时，自动执行操作

前段页面：

<select name="clazz" id="inClazz"></select>

</br>
<select name="user" id="inUser"></select>
</br>
</br>

前端操作：
function init() {
    $.ajax({
        type: "get",
        url: "http://f03d601e.ngrok.io/usercenter/clazz/getClazz",
        dataType: "json",
        success: function (data) {
            for (var i in data) {
                $("#inClazz").append("<option value=" + data[i].id + ">" + data[i].name + "</option>");
            }
        },
        error: function (err) {
            console.log(err);
        }
    })
}

$("#inClazz").change(function () {
    getUserByClazzId();
});

function getUserByClazzId() {
    $("#inUser").empty();//首先清空select现在有的内容
    var clazzId = $("#inClazz").val();
    alert("inUser: " + clazzId);
    $.ajax({
        type: "get",
        url: "http://f03d601e.ngrok.io/usercenter/user/getUserByClazzId/" + clazzId,
        data: {
            id: clazzId,
        },
        dataType: "json",
        success: function (data) {
            for (var i in data) {
                $("#inUser").append("<option value=" + data[i].id + ">" + data[i].name + "</option>");
            }
        },
        error: function (err) {
            console.log(err);
        }
    })
}