我今天下午根据我发现的编码器构建了一个小型jQuery手风琴，除非我把它放在我需要它的Wordpress中，否则它可以正常工作。我知道这可能是显而易见的事情，但我现在花了太多时间看着它，我觉得我是在圈子里去。
这是我使用ACF中的一些自定义字段的Wordpress代码：
<aside class="accordion">
<div>
<span class="col-2 showitem"><?php the_field('show_date'); ?></span>
<span class="col-4 showitem"><?php the_title(); ?></span>
<span class="col-4 showitem"><?php the_field('show_city'); ?></span>
<span class="col-2 showitem">?php the_field('ticket_status'); ?></span>
</div>
<?php the_field('show_information'); ?>
</aside>
我在page.php上的脚本：
<script type="text/javascript">
var headers = ["H2"];
$(".accordion").click(function(e) {
var target = e.target,
name = target.nodeName.toUpperCase();
if ($.inArray(name, headers) > -1) {
var subItem = $(target).next();
//slideUp all elements (except target) at current depth or greater
var depth = $(subItem).parents().length;
var allAtDepth = $(".accordion p, .accordion div").filter(function() {
if ($(this).parents().length >= depth && this !== subItem.get(0)) {
return true;
}
});
$(allAtDepth).slideUp("fast");
//slideToggle target content
subItem.slideToggle("fast", function() {});
}
});
</script>
我还应该提一下我在网站上使用这个Ajax Load More extension，当我从页面中删除任何与之相关的东西时，只是保持简单，它就可以了。所以我99％肯定它与两件事的互动性有关。但jQuery不是我的包，所以我希望比我聪明的人知道我哪里出错了。
我也有P作为显示：无;因为否则它会一直出现。
感谢您查看我的问题！
JD：）
p.s，原始的codepen在这里http://codepen.io/rbobrowski/pen/likvA/
更新： 我尝试将所有$更改为jQuery，然后更改jquery。我也尝试了两个@ jai的建议，没有运气。我还尝试了@ freedomn-m链接的解决方案，以及检查和测试搜索结果中多个链接的方法，但没有运气。
答案 0 :(得分：1)
在wordpress中$符号不可用，您可以将其更改为jQuery或将代码放在 IIFE 中，您需要将事件绑定放在doc中准备好块：
(function($){ // get it with '$'
$(function(){ // <---doc ready block
// put all the code in here
});
})(jQuery); // <---pass jQuery here
实际上你需要将你的代码放在doc ready块中，但是使用jQuery作为包装器并在args中使用$：
jQuery(function($){ // use jQuery and pass `$` for a reference to jQuery.
// code here.
});
答案 1 :(得分：0)
您应该将所有$替换为jQuery
或
jQuery(function($){
// do all code here
});
答案 2 :(得分：0)
手风琴代码对我的目的来说太复杂了，我最终剥离了它并用
解决了jQuery问题jQuery(document).ready(function($) {
my code in here
});
感谢大家的帮助，非常感谢。