javascript - 如何在 Wordpress 中创建添加以进行比较？

Question

我不想使用任何插件。我尝试使用 cookie 创建比较页面，但仍然遇到问题。谁能告诉我如何在 wordpress 中创建比较产品？

使用 Loop 我在添加“添加到比较”链接或按钮的位置得到以下输出

<table>
<tr>
  <td> Product ID</td>
  <td>Product Name</td>
  <td><a href="#">Add To Compare</a></td>
</tr>
<tr>
  <td> 123</td>
  <td>P-one</td>
  <td><a href="#">Add To Compare</a></td>  
</tr>
<tr>
  <td>234</td>
  <td>P-2</td>
  <td><a href="#">Add To Compare</a></td>
</tr>
<tr>
  <td>345</td>
  <td>P-3</td>
  <td><a href="#">Add To Compare</a></td>
</tr>
<tr>
  <td>456</td>
  <td>P-4</td>
  <td><a href="#">Add To Compare</a></td>
</tr>
  </table>

我的逻辑不清楚。我不知道应该如何构建添加以比较产品页面。但我尝试按照以下步骤创建比较产品页面:

---

我创建了两种自定义帖子类型:

1. 主要产品
2. 子产品

主要产品是子产品的父帖子。这意味着子产品是主要产品的子产品。

Main products 是品牌的帖子，Sub Products 是我们添加与这些品牌相关的产品及其详细信息的帖子。

我有一个名为 BARATA 的品牌(假设 :P)，他们的产品是:

1. 巴拉塔·彭
2. 巴拉塔 Ptwo
3. 巴拉塔三
4. 巴拉塔·福尔

它们都有相同的规范，如 WIDTH、LENGTH、HEIGHT。

在 Main Product 自定义模板中，我添加了这个循环以从子产品获取它的子帖子

<table>
            <thead>
                <tr>
                    <th><h4>Product Name</h4></th>
                    <th><h4>Any Info</h4></th>
                    <th><h4>Select to Compare</h4></th>

                </tr>
            </thead>
            <tbody>
<?php
$childargs = array(


'orderby' => 'post_title',
'order' => 'ASC',
);
$compi = 1;
 $child_posts = types_child_posts("subproducts",$childargs);
foreach ($child_posts as $child_post) {  

$variid = $child_post->ID;
$variname = "compareid".$compi++;
?>


            <tr>
                    <td><?php echo $child_post->post_title; ?></td>
                    <td><?php echo get_post_meta($child_post->ID, 'any-info-cutomfield', TRUE);  ?></td>
                    <th><a href="" onclick="setting_my_first_cookie('<?php echo $variid; ?>','<?php echo $variname; ?>')">Compare</a>

<a href="" onclick="setting_my_first_cookie_delete('<?php echo $variid; ?>','<?php echo $variname; ?>')">Remove</a>
</th>

                </tr>
            </tbody>
<?php
// Accessing an individual cookie value
echo $_COOKIE[$variid];
echo $_COOKIE[$variname];

?>

  <?php 
} 

?>

以上代码获取主页的子产品并使用添加到比较按钮将它们显示在表格中。在 $variid 中，我存储了子产品的 ID 及其名称 $variname。

我使用 Onclick 将这些数据发送到 javascript 函数以创建 cookie。

Javascript:

<script type="text/javascript"> 

function setting_my_first_cookie(variid,variname) {
 var d = new Date();
    d.setTime(d.getTime() + (30*24*60*60*1000));
    var expires = "expires="+d.toUTCString();
    document.cookie = variname + "=" + variid + "; " + "expires; path=/; domain=.domain.com";
}
</script>

<script type="text/javascript"> 

function setting_my_first_cookie_delete(variid,variname) {
   document.cookie = variname + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT; path=/; domain=.domain.com';
}
</script>

在比较页面上，我可以检索这些数据以显示这些产品的比较。但也有一些问题。就像我不知道如何为要比较的产品添加限制。

你能给我添加产品进行比较的逻辑吗？别人是怎么做到的？我该怎么做？请引导我走向正确的方向。

Answer 1

您可以使用 $_SESSION，这可能是处理逻辑的一种更简洁的方式。添加/删除项目的函数如下(未经测试的代码):

$_SESSION['barata_products'] = [];

function add_products(varid) {
    array_push($_SESSION['barata_products'],varid);
}

function remove_product(varid) {
    $product_index = array_search(varid,$_SESSION['barata_products']);
    unset($_SESSION['barata_products'][$product_index]);
}

function remove_all_products() {
    $_SESSION['barata_products'] = [];
}

//helper function to check if the session array is greater than your desired amount, where x is number of products within the array.
function more_than_x(session,x) {
    $_SESSION['barata_products'].count() > x ? true : false
}

如果您需要 wordpress session 的更高级逻辑，请查看 this blog