Question

我已将自定义表添加到WordPress数据库。除此之外，我还创建了一个短代码，可以将其附加到我的WordPress网站上的特定页面。表格有两列， ID 和优惠券代码。

自定义表用于存储优惠券代码，并且我需要能够在按钮的单击事件中显示该表中的第一行列值（coupon_code = INSERT NUMBER ）。

function coupon_codes() {
 ?>
    <button class="reveal_coupon" onclick="reveal_coupon()">CLICK TO REVEAL 
COUPON CODE</button>
    <div class="coupon"></div>
      <?php
        global $wpdb;
        $result = $wpdb->get_results ( "SELECT * FROM coupon_codes LIMIT 1" 
        );
        foreach ( $result as $print )   {
          echo $print->coupon_code;
        }
}
add_shortcode( 'coupon_codes' , 'coupon_codes' );

我确实知道要实现此目的，我需要将PHP代码移到单独的PHP文件中，因为该代码仅在服务器端运行，并且只有在click事件上运行文件时才能实现。我了解那部分。

除非使用click事件调用，否则无法显示行值。这就是为什么我认为JS / jQuery可以在这种情况下工作的原因，但是我无法准确地找出使脚本工作的脚本。

Answer 1

您似乎对PHP和HTML / JS / CSS的交互方式有误解。

如果在单击按钮之前不能显示行值（我假设您拥有<button class="reveal_coupon"...元素），那么这里的位置几乎正确。假设您的<div class="coupon"></div>优惠券专门用于保存PHP脚本输出的优惠券数据，我将做一些观察：

您echo coupon div的数据{em>外部，因此您输出的任何内容都不一定要遵循CSS样式和您为此元素所追求的JS逻辑。在<div class="coupon">和</div>之间移动PHP代码。
为了实现所需的功能，您需要添加相关的JavaScript和CSS样式。最可维护的方法是将JS和CSS分解为单独的文件，并在新的function / wp_enqueue_script钩对中利用wp_enqueue_style和enqueue函数在其中插入对这些文件的引用在适当的时间DOM：
```
add_action ( 'wp_enqueue_scripts', 'coupon_enqueue_scripts' );
function coupon_enqueue_scripts() {
    wp_enqueue_script("coupon", "coupon.js");
}

add_action ( 'wp_enqueue_styles', 'coupon_enqueue_styles' );
function coupon_enqueue_styles() {
    wp_enqueue_style("coupon", "coupon.css");
}
```
在这些文件中，您想添加（a）Javascript逻辑以实现当前HTML输出中引用的reveal_coupon()函数，以及（b）CSS样式以初始隐藏优惠券代码。

单击按钮时显示数据库中的Wordpress数据库自定义表行列值

1 个答案: