Попытка изменить фоновое изображение, нажав на изображение, jQuery, HTML, CSS

#javascript #jquery #html #css

#javascript #jquery #HTML #css

Вопрос:

У меня есть изображения, которые я отфотошопил, которые являются значками погоды, такими как солнце, облако, дождливая туча и т.д. На сайте я хочу иметь возможность нажимать на них и изменять фоновое изображение сайта, основной фон. Но это не работает, не удается щелкнуть по изображению, ничего не происходит. Это то, что у меня есть на данный момент, с #skyclear, являющимся идентификатором изображения, и clearsky, являющимся стилем css =>

 $('body').addClass(bodyClass);

$('#skyclear').on('click', () => {
    bodyClass = 'clearsky'
})

1. Можете ли вы опубликовать свой код?

2. Вам нужно установить класс body внутри функции.

3. Вы должны удалить класс clearsky из тела с помощью removeClass() и добавить новый класс с помощью addClass(). Простое изменение содержимого переменной не меняет класс элемента.

4. @Natha Я в замешательстве, зачем мне удалять добавляемый класс, а затем добавлять его? Как я мог даже удалить его, если его еще даже нет?

5. @CalebNorris извините, я хотел удалить старое тело класса, которое было раньше, а затем добавить clearsky.

Ответ №1:

 $('body').addClass(bodyClass);

Это должно быть в функции onClick. Вам также следует рассмотреть возможность удаления любых ненужных классов внутри onClick.

Ответ №2:

Я бы просто сделал это так:

 $('#skyclear').on('click', function(){
    $('body').addClass('clearsky');
});