在 Jquery 中選擇項目時如何避免更改事件？

Question

我正在創建選擇以從數據庫中選擇數據，但為選擇器設置ID="myselect"

但是，如果我選擇了一個項目並更改為另一個項目，則此 ajax 將調用我只想在用戶單擊其項目時調用 ajax 一次。

$(document).on("click", "#myselect", function (e) {

    $.ajax({
        url: '/teller/assignTo',
        dataType: 'json',
        Method: 'get',
        success: function (data, status) {

            var userId = data.users;
            $.each(userId, function (key, value) {
                $('#myselect').append($("<option></option>").attr("value", key).text(value.name));
            });
        },
        error: function () {
            throw new Error("Could not load  " + data);
        }
    });
});

HTML

<select name="assign_user_id" id="myselect" class="form-control" ></select>

Answer 1

嘗試這個

HTML

<select name="assign_user_id" id="myselect" class="form-control not-clicked" ></select>

查詢

$(document).on("click", "#myselect", function (e) {
    if( $(this).hasClass( "not-clicked" ) ) {
        $.ajax({
            url: '/teller/assignTo',
            dataType: 'json',
            Method: 'get',
            success: function (data, status) {    
                var userId = data.users;
                $.each(userId, function (key, value) {
                    $('#myselect').append($("<option></option>").attr("value", key).text(value.name));
                });
            },
            error: function () {
                throw new Error("Could not load  " + data);
            }
        });
        $(this).removeClass("not-clicked");
    }
});