Question

我有一个客户端Wordpress网站，其中客户端有一堆分为不同类别的短帖。这些都显示在主博客页面上。当用户点击类别名称时，我不想使用Wordpress的内置功能将用户带到新的类别页面，而是希望在保留在页面上时显示/隐藏相关帖子。他们的类别名称作为类应用于帖子。

一旦我能够抓住用户点击的类别，那么实际的隐藏/显示机制将很容易实现，但这是我遇到困难的一点。 Wordpress可以生成类别列表（链接与否），但是为每个列表项添加 onclick ...

<li onclick="catSort(this)">Category</li>
function catSort(obj) { var singleCat = obj.innerHTML; ... }

（请注意，即使没有this关键字，这也不起作用，例如，如果我只是尝试拨打提醒）

...迭代类别并编写 click（）函数脚本...

var catArray = $('.vendor_categories').find('a');`
for (i = 0; i < catArray.length; i++) {
  catArray[i].click( function () { var singleCat = catArray[i].innerHTML; ... });
}

...使用JS和DOM查询添加 onclick ...

$('.vendor_categories li').onclick = catSort();

......这些都不起作用，我也没有尝试过其他一些解决方案。

使用数组结构，我已经能够获取所有类别名称或任意类别名称并乱用它们（隐藏所有帖子！），但我还没有能够得到用户点击的那个，我不知道为什么。我错过了一些明显的东西吗为什么我无法识别用户的点击？

Answer 1

我认为当您尝试循环调用click函数时会遇到一些问题，该函数会触发每个元素上的click事件。尝试这样的事情：

var catArray = $('.vendor_categories').find('a');`
for (i = 0; i < catArray.length; i++) {
  (function(index){
    catArray[index].onclick = function(e){ 
     e.preventDefault();
     var singleCat = catArray[index]...
  }
  })(i); 
}

根据列表项显示/隐藏具有类的项目：onclick，click（）不起作用？

1 个答案: