JavaScript кнопка «читать больше / меньше» (+/-) не работает в IE - PullRequest
0 голосов
/ 12 марта 2020

следующий сценарий кнопки «развернуть текст» +/- работает в Chrome, но не IE. Я вижу, что некоторые темы говорят, что пусть теперь должно работать в IE11. Может кто-нибудь помочь мне исправить этот скрипт для работы в обоих браузерах?

Заранее спасибо!

    <table>
  <tr>

          <td class="definition" data-keyword="dog"> 
              <button onclick="expandMore('dog')" class="myBtn">+</button><strong>Definition of a dog</strong> a domesticated carnivorous mammal that typically has         
              <span class="threeDots"> ... </span>
              <span class="hiddenText" style="display: none;"><br>a long snout, an acute sense of smell, non-retractable claws, and a barking, howling, or whining voice.</span>              
          </td>
        <td>8 (3)(d)</td>
      </tr>

</table>

<script>
function expandMore(keyword) {
    let threeDots = document.querySelector(`.definition[data-keyword="${keyword}"] .threeDots`);
    let hiddenText = document.querySelector(`.definition[data-keyword="${keyword}"] .hiddenText`); 
    let btnText = document.querySelector(`.definition[data-keyword="${keyword}"] .myBtn`);

    if (threeDots.style.display === "none") {
        threeDots.style.display = "inline";
        btnText.textContent = "+";
        hiddenText.style.display = "none";
    } else {
        threeDots.style.display = "none";
        btnText.textContent = "-"; 
        hiddenText.style.display = "inline";
    }
}
</script>

1 Ответ

0 голосов
/ 12 марта 2020

Я думаю, что литерал шаблона еще не поддерживается IE. Если вы посмотрите на: https://kangax.github.io/compat-table/es6/

Измените его на

let threeDots = document.querySelector('.definition[data-keyword="' + keyword + '"] .threeDots');

Или перенесите его, используя Babel https://babeljs.io/

...