Использование AJAX для динамического изменения данных из выпадающего списка

Question

Я пытаюсь динамически изменять прозрачность моих графических полос. У меня есть они в настоящее время говорят пользователю обновить страницу, которую я не хочу. Как я могу использовать AJAX для достижения чего-то подобного?

const opacitySlider = document.getElementById('opacity');

$('#opacity').on('input', function () {
    $('.bars').css('opacity', $(this).val());
    localStorage.setItem('opacity', opacitySlider.value);
    checkAlert.innerHTML = 'Please click the refresh button or reload the page to make new changes.';
});

Answer 1

Я не совсем понимаю, что вы хотите, так как $('.bars').css('opacity', $(this).val()); должен изменить opacity, если $(this).val() имеет значение между 0 and 1.

но если вы хотите внести изменения из ajax, вам просто нужно использовать функцию jQuery ajax, например

$('#opacity').on('input', function () {
    $('.bars').css('opacity', $(this).val());
    localStorage.setItem('opacity', opacitySlider.value);
        });
    $.ajax({
            url : '/your/url',
            method: 'GET',
            success: function(response) {
                    //assuming you're retrieving the opacity from server
                    $('.bars').css('opacity', response.opacity);
            }
    })