在ajax加載的內容上觸發更改和加載事件

Question

我有一個代碼，它在選擇框#type作為id的change事件上運行。 該元素是通過Ajax在引導模式窗口中加載的。 通過顯示/隱藏相關元素並觸發ajax請求，它可以很好地處理更改事件。

現在，我想每次都運行它，除了change事件之外，Ajax內容也要加載，因為有時#type元素會加載默認值，並且我想顯示/隱藏元素並在加載Ajax內容時觸發Ajax請求。

我試圖使用這樣的load事件，

$(document).on('load change', '#geo-form #type', function () {...

但編號無效。 我該如何進行這項工作。

到目前為止，這是默認的工作代碼。

$(document).on('change', '#geo-form #type', function () {
    var value = $(this).val();
    console.log(value);
    if (value == '') {
        $.getJSON(url('ajax/divisions'), null, function (data) {
            $("#geo-form #division_id").html('');
            $("#geo-form #division_id").append(
                $("<option></option>").text('Select one').val('')
            );
            $.each(data, function (id, name) {
                $("#geo-form #division_id").append(
                    $("<option></option>").text(name).val(id)
                );
            });
        });
    }
    switch (value) {
        case 'district':
            $('#geo-form .division').removeClass('hide');
            $('#geo-form .district').addClass('hide');
            $('#geo-form .tehsil').addClass('hide');
            $('#geo-form .block').addClass('hide');
            break;
        case 'tehsil':
            $('#geo-form .division').removeClass('hide');
            $('#geo-form .district').removeClass('hide');
            $('#geo-form .tehsil').addClass('hide');
            $('#geo-form .block').addClass('hide');
            break;
        case 'block':
            $('#geo-form .division').removeClass('hide');
            $('#geo-form .district').removeClass('hide');
            $('#geo-form .tehsil').removeClass('hide');
            $('#geo-form .block').addClass('hide');
            break;
        case 'village':
            $('#geo-form .division').removeClass('hide');
            $('#geo-form .district').removeClass('hide');
            $('#geo-form .tehsil').removeClass('hide');
            $('#geo-form .block').removeClass('hide');
            break;
    }
});

Answer 1

您可以在重新創建時手動觸發它：

$("#geo-form #division_id").trigger('change');