Rails: Как изменить изображение в javascript?

Question

Это мой код JavaScript:

  //changing of eye icon of status
  $('.status-visible').on('click', (e) => {
    if ($(e.currentTarget.children[0]).attr('src') == '../assets/visible.png') {
      $(e.currentTarget.children[0]).attr('src', '../assets/notvisible.png');
      $(e.currentTarget).attr('uk-tooltip', 'Not Visible');
    }
    else {
      $(e.currentTarget.children[0]).attr('src', '../assets/visible.png');
      $(e.currentTarget).attr('uk-tooltip', 'Visible');
    }
  });

Он работает на локальном компьютере, но когда я загрузил его на heroku и запустил ресурсы: прекомпиляция создаст новое имя.

А это мой HTML-код:

<td>
                        <button class="uk-border-rounded status-visible" uk-tooltip='Visible'>
                          <img src="../assets/visible.png" class='uk-icon-image' />
                        </button>
                      </td>

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

Answer 1

Вы можете переместить изображения в папку public/ и ссылаться на них напрямую:

  $('.status-visible').on('click', (e) => {
    if ($(e.currentTarget.children[0]).attr('src') == '/visible.png') {
      $(e.currentTarget.children[0]).attr('src', '/notvisible.png');
      $(e.currentTarget).attr('uk-tooltip', 'Not Visible');
    }
    else {
      $(e.currentTarget.children[0]).attr('src', '/visible.png');
      $(e.currentTarget).attr('uk-tooltip', 'Visible');
    }
  });

HTML

<td>
  <button class="uk-border-rounded status-visible" uk-tooltip='Visible'>
    <img src="/visible.png" class='uk-icon-image' />
  </button>
</td>