WordPress的自定义字段内容作为弹出窗口

Question

我将价格存储在自定义字段“价格”中。 clickbtn是赋予按钮形状的类。 我试图在clickbtn中只显示“单击此处以显示价格”文本...我想要实现的是，当用户单击clickbtn时，会出现一个弹出窗口，其中应包含“价格”的内容以及在新标签页中打开链接www.bookurl.com。

<div class="clickbtn">
   <a href="http://www.bookurl.com">
      <?php echo get_field('price');?> Click Here to reveal price
   <a>
</div>   

Answer 1

您必须为此使用javascript，而不是标记的PHP。

最简单的方法，使用简单的JS：

<span id="price" style="display:none"><?php echo get_field('price');?></span>
<a id="price_ad" href="http://www.bookurl.com" onclick="show_price()" target="_blank">
   Click Here to reveal price
<a>

<script>
   function show_price() {
       document.getElementById('price').style.display = '';
       document.getElementById('price_ad').style.display = 'none';
   }
</script>

这样，在单击时，链接消失，价格出现，然后弹出窗口打开。