HTML функция объема Jquery

Question

Вот моя функция, которая в настоящее время работает.

$(function() {
    $("#myVideo").each(function() {
        this.volume = 0.0;
    });
});
$(function() {
    $("#myVideo").click(function() {
        this.volume = 0.8;                            
    });
});

Первый устанавливает громкость на 0 при загрузке моего видео. Вторая функция, onclick, установит громкость на 0,8.

Мой вопрос: Как я могу щелкнуть по картинке один раз, чтобы установить громкость = 0,8, а затем снова щелкнуть, чтобы установить громкость обратно на 0,0. И делайте это столько раз, сколько пожелает пользователь.

Спасибо!

Answer 1

Я собираюсь игнорировать первый сегмент скрипта, так как кажется, что вам важна только часть .click. То, что вы можете сделать, это иметь переменную, которая чередуется между 0.0 и 0.8, и иметь значение, на которое установлен объем. Грубый макет ниже:

var change = 0.8
$(function() {
    $("#myVideo").click(function() {
        this.volume = change;  
        if (change == 0.8) { change = 0.0 }
        else { change = 0.8 }                          
    });
});

Answer 2

Для этого вам нужна кнопка переключения.

var on = false;
$(function() {
    $("#myVideo").click(function() {
       on = !on;
       this.volume = (on) ? 0.8 : 0;                            
    });
});

Answer 3

Вы можете добавить оператор if.

$(function() {
    $("#myVideo").each(function() {
        this.volume = 0.0;
    });
});
$(function() {
    $("#myVideo").click(function() {
        if(this.volume == 0.8){
          this.volume = 0.0;
        }
        else{
          this.volume = 0.8
        }
    });
});

Со встроенным оператором.

$(function() {
    $("#myVideo").each(function() {
        this.volume = 0.0;
    });
});
$(function() {
    $("#myVideo").click(function() {
        (this.volume == 0.8) ? this.volume = 0.0 : this.volume = 0.8
    });
});