Как сделать на одну кнопку два разных( в моем случаи противоположных) события?

Question

[Вадим]

Всем привет! Только изучаю js, еще не дошел до решения такой задачи, которая у меня возникала. Есть кнопка, один клик-пауза, второй клик по ней же -старт. Желательно на jQuery. В голове крутится, но не могу сообразить..

Answer 1

[Николай]

Храните состояние.

function Player(element) {
    this.element = element;
    this.state = {
      isPlaying: false;
    };
    // сохраняем контекст нашего класса для хэндлера события
    this.toggle = this.toggle.bind(this);
    this.element.addEventListener('click', this.toggle );
}
// функция, меняющая state нашего контрола и выполняющая какое-то действие в зависимости от этого state
Player.prototype.toggle = function(event) {
    this.state.isPlaying = !this.state.isPlaying;
    if (this.state.isPlaying) {
          this.play();
    } else {
         this.stop();
    }
    
};
// очищаем сообытия
Player.prototype.destroy = function() {
    this.element.removeEventListener('click', this.toggle);
};
// 
Player.prototype.play = function() {};
Player.prototype.pause = function() {};

// использовать как:
var player = new Player(domElement);

Answer 2

[Александр]

так jsfiddle

Answer 3

[iBird Rose]

при клике вешаешь какой нить класс. в двух словах - пишешь условие, что при клике на кнопку без этого класса - она будет play, а если класс уже присутствует - то pause

Comments

[Вадим]

да, логика хорошая