Изменить атрибут заголовка динамически

Question

Я пытаюсь добавить пользовательскую подсказку для значков управления в GoldenLayout.

Пока что я сделал, я нахожу класс значков каждого контроллера и добавляю новый атрибут с именем tooltip и удаление title приписывать.

Который прекрасно работает для close & open in new window, но для minimise а также maximise мне нужно установить tooltip значение динамически, а также необходимо удалить title атрибут

Я не могу достичь этой функциональности. Пожалуйста помоги

Полный код https://jsfiddle.net/sutgfg1y/

myLayout.on('stackCreated', function(stack) {

  stack
    .header
    .controlsContainer
    .find('.lm_close') //get the close icon
    .attr('tooltip', 'Close')
    .removeAttr('title')
  stack
    .header
    .controlsContainer
    .find('.lm_popout') //get the close icon
    .attr('tooltip', 'Open in new window')
    .removeAttr('title')
  stack
    .header
    .controlsContainer
    .find('.lm_maximise')
    .attr('tooltip', 'maxi')
    .removeAttr('title')
    .click(function() {
      var maxi = stack
        .header
        .controlsContainer
        .find('.lm_maximise')
        .attr('tooltip')
      alert(maxi)
    })

});

Answer 1

Держите текущее значение всплывающей подсказки в переменной. Переключите это значение по щелчку и сбросьте всплывающую подсказку...

myLayout.on('stackCreated', function(stack) {
  // Keep track of the state of the tooltip
  var minMax = 'maximize';

  stack
    .header
    .controlsContainer
    .find('.lm_close') //get the close icon
    .attr('tooltip', 'Close')
    .removeAttr('title')
  stack
    .header
    .controlsContainer
    .find('.lm_popout') //get the close icon
    .attr('tooltip', 'Open in new window')
    .removeAttr('title')
  stack
    .header
    .controlsContainer
    .find('.lm_maximise')
    .attr('tooltip', minMax) // Set the starting value
    .removeAttr('title')
    .click(function() {
      // Verify what your click just did
      var maxi = stack
        .header
        .controlsContainer
        .find('.lm_maximise')
        .attr('tooltip');
      alert(maxi);

      // Toggle the tooltip
      minMax = minMax === 'maximize' ? 'minimize' : 'maximize';
      stack
        .header
        .controlsContainer
        .find('.lm_maximise')
        .attr('tooltip', minMax);
    })
});