Question

问题

我有一个基于每月订阅的 WordPress 网站，它为用户提供每月内容，并在每个月末自动将其移至下一个订阅（但需要付款才能继续）。用户有一个页面，列出了网站上的所有订阅级别（以及他们已经购买了哪些级别）。我正在使用名为 Ultimate Membership Pro 的插件来实现此目的。

当我们不得不将它与 WooCommerce 集成时（问题很充分），就会出现问题。因此，当用户购买了订阅级别时，它仍然可以选择在订阅级别页面上再次购买。

我使用php禁用了重复购买功能，但我需要在订阅列表页面上动态禁用购买按钮（下面的小提琴中列出了一个示例）。

尝试解决方案

使用foreach循环和一些 DOM树遍历，jQuery会在顶部找到它所在级别的名称，并在页面上禁用其按钮。这很好用。

问题是当列出多个级别时，它不起作用。

我有两个小提琴来证明这个问题。

PS，因为我在Wordpress中工作，我的jQuery是在无冲突模式下编写的。

示例＆amp;代码

jQuery(function($) {
  $('.ihc-level-item .ihc-level-item-title').each(function() {
    // Get the level name
    var lvlName = $('.ihc-account-subscr-list .ihc-level-name').text();
    // Find that level on page
    if ($(this).html() == lvlName) {
      // Console log confirms its working
      console.log('Found level: ' + lvlName + ' on page.');
      $(this).closest('.ihc-level-item').children('.ihc-level-item-content').addClass('lvl-purchased');
    }
  });
});

Working example
仅列出了一个级别

Non working example
列出了两个级别

Answer 1

我使用 meagar♦回答click here

解决了这个问题

我只需要将级别名称存储在一个数组中并访问它然后presto！

$('.ihc-level-item .ihc-level-item-title').each(function() {
  // Get the level names and store inside array
  var array = [];
  var lvlName = $('.ihc-account-subscr-list .ihc-level-name').map(function () { return $(this).text(); }).get();
  console.log(lvlName);
  for (var i=0; i<lvlName.length; i++) {
    // Find that level on page
    if ($(this).html() == lvlName[i]) {
      $(this).closest('.ihc-level-item').children('.ihc-level-item-content').addClass('lvl-purchased');
    } else {
      console.log('Couldn\'t find level on page.');
    }
  }
});

迭代并遍历DOM树

问题

尝试解决方案

示例＆amp;代码

1 个答案: