Question

在Wordpress/Woocommerce构建中具有以下代码。问题是该按钮仅在第二次单击时有效。第一次点击就需要它，我的代码怎么了？

// Add button to hide Personalisation

add_action('woocommerce_single_product_summary', 'custom_text', 29);

function custom_text() {
    print '<button class="personlisation-button" onclick="myFunction()">Add Personalisation</button>';  
}

// Script to toggle visibility

<script type="text/javascript">
  function myFunction() {
    var x = document.getElementById("wcj_product_addons");
    if (x.style.display === "none") {
      x.style.display = "block";
    } else {
      x.style.display = "none";
    }
  }
</script>

Answer 1

最好添加null的支票。您的页面上可能没有这样的元素。

function myFunction() {
  var x = document.getElementById("demo");
  if (x != null && x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

<button
  onclick="myFunction()"
>
  Toggle</button
>

<div id="demo">Hello world</div>

点击功能仅在第二次点击时有效

1 个答案: