jQuery手风琴总是展开/需要刷新才能工作

Question

对不起，如果在其他地方已回答，请多多包涵，但我已经搜索并未找到解决此场景的答案。实际上，总是想要相反的东西或类似的东西...

我有一个网站，www.namesakeradio.com。似乎每当有人第一次访问网站时，有时候随机出现折叠控件展开全部的情况。

您只需刷新页面，它就能正常工作。这在我所有页面上都是相同的-移动页面和音乐页面。

也许有一个简单的JS函数，可以在访问页面时自动刷新容器（即折叠控件容器），从而避免这个问题？或者任何人都可以查看页面源代码，或者我很高兴在这里包含源代码... 如果不该这样做，我就不想编写代码。 这是我在这里的第一个JS问题，请告诉我您希望我添加、撤销等的任何事项，我会照做。

非常感谢。

- Haplo

Answer 1

这是因为有时候jquery没有完全下载，但您的网站尝试初始化手风琴插件。

我建议您将所有JavaScript文件移动到页面末尾，在关闭的</body>标签之前。

<script src="js/picturefill.min.js" class="picturefill" async="async"></script>
<script src="http://streams4.museter.com:2199/system/streaminfo.js"></script>
<script src="./jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
    $(function () {
        $("#accordion").accordion({
            collapsible: true,
            active: false,
            heightStyle: "content"
        });

        $(".selector").collapsibleset("refresh");
    });
</script>
</body> <!-- CLOSING BODY TAG IS HERE -->

那样，您就可以确信，只要所有内容都被下载完成，您的手风琴函数就会被执行。

希望这能帮助您。

- JiiB

---

啊！好的，我一直以为应该把js放在顶部，这样它就会首先加载。 :P 我现在会这样做的。非常感谢！ - Haplo

我一直在尝试以不同的方式放置它。仍然得到相同的随机结果。我试着把脚本源代码留在顶部，把脚本本身放在</body>标签之前的底部。尝试将两行源代码和脚本移到底部，反转等。我仍然在跨浏览器和平台上看到相同的问题。我只是缺少了什么。 - Haplo

我相信这是不正统的，把“刷新”调用移到它自己的位置怎么样？我假设根据上下文它在调用手风琴容器的刷新？如果是这样，我能不能把它分离出来，在页面底部只调用一次？甚至在刷新之前等待一秒钟？我不知道，我只是在这里提出一些想法 :) - Haplo

Answer 2

好的，经过无尽的尝试，我终于找到了一个解决方案。我不知道为什么它有效，但它似乎有效，所以我会在这里发布它，希望未来遇到类似问题的人也能用上：

我将以下 jQuery 脚本请求放在所有其他请求的最顶部：

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

然后我把所有其他非jQuery脚本源定义放在它之后，最后我把以下内容放在“堆栈”的底部：

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

总之，我将手风琴脚本放在页面HTML底部，就在标签前面。

所有这些似乎已经解决了新访问加载和随后的随机加载的任何问题。我真的很感激正确方向上的帮助。非常感谢！

- Haplo