WordPress锚点单击JavaScript打开详细信息

Question

我有一个WooCommerce网上商店，我在产品变体标签旁边放置了唯一的href锚点：

页面下方是当您单击相应的锚点时要打开的HTML（详细信息和摘要）。我不想在href中使用onclick。

(html above) 
<a class="extra_label" id="lunch" href="#anchor">i</a>

(html below) 
<details id="det">
    <summary><a class="leesmeer">Uitgebreide Lunch</a></summary>
    blablabla
</details>

我已经包含了html ID和JavaScript：

<script>
    document.getElementById("lunch").addEventListener("click", displayopen);

    function displayopen() {
        document.getElementById("det").open = true;
    }
</script>

但是到目前为止它不起作用。

Answer 1

您的表演元素似乎有问题。如果要显示元素，则应使用： document.getElementById("det").style.display = 'block';并将其隐藏： document.getElementById("det").style.display = 'none';

或者您可以使用类来指示隐藏/显示状态。

Answer 2

对不起，事实证明我需要正确地使脚本入队，我在标头中回显了它，但这是一种不好的做法，也无法正常工作……谢谢！