关于 Jquery 的加载问题,只有刷新页面部分 js 才生效

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 1699 天前的主题，其中的信息可能已经有所发展或是发生改变。

我的网站,jquery 代码,只有刷新页面,菜单栏才能生效,而且一会生效一会又不生效,太奇怪了初次加载不生效,刷新一次页面才生效,或者需要刷新好几次页面才生效,再刷新又不一定生效了.没有规律

请前端大神指点一下. 我的网站是:www.cakevin.com 点击左边的 menu 测试

我的 base 页面 JS 代码是:

调用 first_load.js 页面

我的 base 页面 JS 代码引人顺序是:

详情看网站源码,先谢谢了

script

生效

页面

js'

25 条回复 • 2020-04-12 04:42:14 +08:00

learningman

2020-04-11 01:18:41 +08:00 via Android

不想看代码，盲猜 pjax，pjax 要重载
话说你这个需求不付费有点离谱。

lxk11153

2020-04-11 01:36:50 +08:00

已找到问题，来来来，付费咨询 Contact: cXEvd3g6IDQ0Mzk3NDE1OQ== (base64)

canadahetian

2020-04-11 07:15:51 +08:00

@lxk11153 怎么付费啊?

canadahetian

2020-04-11 07:18:04 +08:00

@learningman
@lxk11153
我发现问题应该出在我另外一个 js 文件

<script src="{% static 'js/nifty.min.js' %}"></script>

的加载问题,好像是

<script>get_mennus_list1("1")</script>

还没有执行完成,
/nifty.min.js 就已经开始加载了.

是这个问题吗?,还在尝试解决中.

cydian

2020-04-11 08:16:11 +08:00 via Android

@canadahetian 浏览器 F12
先看 js 加载完成没。
用 console.log 打印下加载完成顺序，
然后再逐个排查。

lxk11153

2020-04-11 08:56:24 +08:00

@canadahetian #3 加我 come on baby.

canadahetian

2020-04-11 10:09:47 +08:00

@cydian 现在就是这么干的,现在不知道,怎么才能,让一段 js 代码执行完成后,在加载另外一个 js 文件,
两个 JS 文件同时加载,导致,第一个还没加载完,第二个就执行了

canadahetian

2020-04-11 10:11:40 +08:00

@lxk11153
哥,我看了一下你主页问的问题,感觉.....
我在等等别的高手吧.

Track13

2020-04-11 10:29:55 +08:00 via Android

@canadahetian 加上 defer 看看，或者动态插入。

cydian

2020-04-11 10:41:18 +08:00 via Android

@canadahetian 你对 js 有误解吧。

canadahetian

2020-04-11 11:10:09 +08:00

@Track13 defer 不是 go 语言的吗? 我 django 项目

@cydian 我打了断点,视乎发现点问题了,www.cakevin.com 这个里面在 get_mennus_list1("1") 打了断点,不确定是不是这个问题,还在按照你的方法排查.

Track13

2020-04-11 11:13:16 +08:00 via Android

@canadahetian 外链的 js 可以加 deder 关键字延迟执行。那你觉得不行就动态插入，和语言有什么关系。

rain0002009

2020-04-11 11:19:41 +08:00

首先菜单是异步加载的，然后加载后我并没有看到初始化菜单的代码大概率都不在同一个 js 里面
所以生不生效就看请求跑的是不是比菜单初始化代码快

canadahetian

2020-04-11 11:45:45 +08:00

@rain0002009 感谢,终于说到点子上了,现在就是说你说的问题,就看哪个 JS 先跑完,你看一下我网站,你刷新一下就明白了,我现在解决如何才能 100%确定,加载完生成 html 的 js 后在调用给菜单添加属性的 JS,我前端接触不深,弄起来有点困难.

@Track13 非常感谢,我的 JS 不是外链,全部是站内的.

canadahetian

2020-04-11 11:47:30 +08:00

@rain0002009 初始化菜单的代码在 first_load.js 里面

lxk11153

2020-04-11 11:56:18 +08:00

@canadahetian #8 _(¦3 」∠)_ 被鄙视了，感觉我一定要问 /答一些看起来很高级的问题才能解决你的这个问题？
到底怎样才能成为你眼中的高手呢？ java/js 是我的主语言，相关的 css/vue/jquery 都行，Python 也可以，之前还帮别人盲搜解决了个 win32gui 问题: https://stackoverflow.com/a/32698102/10298463 (这是我的回答)

canadahetian

2020-04-11 12:07:58 +08:00

@lxk11153 没有鄙视的意思,我就是觉的,这个么小问题,会者不难,难着不会啊,还搞怎么复杂,不够程序员精神啊,我做管理太多年了,现在回到加拿大,没办法需要从新捡起代码,所以问题比较 low,我以前写代码的时候,只要我会的基本上都直接帖代码,不爱墨迹,你说这个问题,你已经搞定了,我说了我问你再哪里付款,刚进 V2 不太熟练,你缺钱的话,可以去 freelancer,里面很多项目可以赚些钱.

Track13

2020-04-11 12:11:27 +08:00 via Android

@canadahetian 我说的外链是指单独一个文件 src 引入，没有内联在 html 里。
难道是我理解有误?我没有打开你网站，看其他回复，你需要的不就是把初始化菜单的 js 推迟执行吗？
defer 关键字在所有元素解析完成之后，DOMContentLoaded 事件触发之前完成。

canadahetian

2020-04-11 12:18:25 +08:00

@Track13 有如此高科技操作,我去试试,我现在是 html 里面的 get_mennus_list1("1") 方法调用 first_load.js
<body><script>get_mennus_list1("1")</script></body>
然后等 get_mennus_list1("1") 方法全部跑完,first_load.js 里面的代码后,再调用 nifty.min.js 这个 JS,
如果是 nifty.min.js 比 first_load.js 先跑完,menu 的展开属性<li class="active">就失效了,

lxk11153

2020-04-11 12:20:09 +08:00

@canadahetian #17
1. 没有刻意接私活的想法，滑水时看到就免费帮助或者接一下
2. 结合 1 楼，所以就有了 2 楼
3. 至于你说的什么如何 pay，你加下 2 楼就行了，v2 网页没这功能

canadahetian

2020-04-11 12:28:48 +08:00

@Track13 <script src="{% static 'js/nifty.min.js' %}" defer="defer"></script> 这么用对吗?如果对的话,貌似还是不行.
@lxk11153 二楼是啥啊?看不懂啊,没用过,我还是等等其他人,一起学习下吧.

lxk11153

2020-04-11 12:31:39 +08:00

@canadahetian #21 base64 解码 233-应验了-`我做管理太多年了`-都忘光了
see https://tool.chinaz.com/tools/base64.aspx or https://www.base64decode.org/

rain0002009

2020-04-11 13:07:29 +08:00

first_load.js 里面没有初始化代码只是生成了菜单的 dom 结构并插入文档有调用什么方法让它变成菜单了并没有看到

canadahetian

2020-04-11 23:13:14 +08:00

@rain0002009 <script>get_mennus_list1("1")</script>
这个就是

canadahetian

2020-04-12 04:42:14 +08:00

@rain0002009
@lxk11153
@Track13
@cydian
@learningman

感谢,终于搞定了,我把 Google news 网页里面的 js 代码,解析了一下,发现 google news 也有和我业务需求一样的逻辑代码,
所以我把 Google news 的 JS 代码,外部加载文件部分看了一遍,把我的代码调整好了,下面是代码,有和我同样问题的同学,可以参考一下.
我的问题主要是需要执行完我的 JS 内部方法,再调用外部的 JS,所以谁先加载完说不好,导致代码每次刷新完是否起作用都是未知的,所以我的思路就是找能供控制 JS 加载顺序的代码..以下是代码:

function downloadJSAtOnload() {

var element = document.createElement("script");

element.src = "nifty.js";

document.body.appendChild(element);

}

if (window.addEventListener)

window.addEventListener("load", downloadJSAtOnload, false);

else if (window.attachEvent)

window.attachEvent("onload", downloadJSAtOnload);