Javascript似乎无法在移动设备上运行

Question

我的（WordPress）网站上有一个文本切换选项：

如果单击右侧的红色“信息”链接，则会打开其下方的文本。问题在于它似乎无法在移动设备（iPhone 4）上运行。请参阅所附的屏幕截图。在我看来，JavaScript根本没有加载或无法正常工作？

html链接：

<div id="<?php the_ID(); ?>" class="projectTitel">
    <?php the_title( sprintf( '<h2 class="entry-title"><button rel="bookmark" class="show">', esc_url( get_permalink() ) ), '<div class="info">Info &#8595;</div><div class="close_info">X</div></button></h2>' ); ?>
</div>

javascript代码：

<script type="text/javascript">
var divs = document.getElementsByClassName("projectTitel");

[...divs].forEach(someDiv => someDiv.addEventListener("click", handler));

// by default, all Inhoud divs are hidden
hideElements("Inhoud");
hideElements("close_info");
jQuery('.info').show();

function handler(event) {
    // get the clicked project's index :
    var projectIndex = getClickedProjectIndex(event);

    // toggle the right Inhoud div :
    toggleDiv(document.getElementsByClassName("Inhoud")[projectIndex]);
        toggleDiv(document.getElementsByClassName("close_info")[projectIndex]);
        toggleDiv(document.getElementsByClassName("info")[projectIndex]);
}

// hide all elements that have the provided class name
function hideElements(className) {
    var elements = document.getElementsByClassName(className);

    [...elements].forEach(element => element.style.display = "none");
}

function getClickedProjectIndex(event) {
    var elements = document.getElementsByClassName("projectTitel");
    var projectIndex = 0;

    [...elements].forEach((element, index) => {
        if (element.id == event.currentTarget.id) {
            projectIndex = index;
        }
    });

    return projectIndex;
}

function toggleDiv(element) {

   if (element.style.display === 'none') {
      element.style.display = 'block';
   } else {
      element.style.display = 'none';
   }
}
</script>

Answer 1

在“ Array.from（divs）”上替换“ [... divs]”

并对[... {a}]的所有其他实例执行此操作。