js引用后界面无效

        接触到了一个新的系统,根据用户的需求,加上视频的滚动条来实现根据滚动截图的效果,在查找一番资料后,通过简单的比较,最后选择使用EasyUI的slider滚动条来实现这个功能,把EasyUI的demo下载下来后,把domo的网页copy到项目中,并引入对应的css和js,一切准备就绪后,运行页面,发现页面中的滚动条中没有滚动块, 并且上传视频的功能也失效了,我没有改动任何其他功能的代码,但是就出现这个的问题,这究竟是什么原因呢?苦于一时无法找到解决问题的办法,简单备份了一下,使用svn还原了一下最初的版本,再次运行,功能可以实现。

js引用后界面无效

        接下来分步进行测试,首先把js放到引入,不写easyUI的控件div,<input id ="slider" class="easyui-slider"/>,发现页面的上传功能仍然是无法实现,我想问题一定是出在js和css的引用上,难道是js有冲突的?或者说是css有冲突的?再次检查完之后发现好像是没有冲突。

<link href="${ctx}/js/uploadify3.1/uploadify.css" rel="stylesheet" type="text/css" />
<script src="${ctx}/js/uploadify3.1/jquery.uploadify.min.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/js/jcrop/jquery.Jcrop.js" ></script>
<!-- 滚动条开始 -->
<link rel="stylesheet" type="text/css" href="${ctx}/themes/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="${ctx}/themes/icon.css"/>
<link rel="stylesheet" type="text/css" href="${ctx}/js/roller/demo.css"/>
<script type="text/javascript" src="${ctx}/js/roller/jquery.easyui.min.js"></script>
<!-- 滚动条结束 -->

        最终是问的是组长,原来问题就在于的是js冲突,只不过我忘记了这个页面本身引用了其他页面,而其他页面中引用了js和本页的js有冲突。

        js引用和把这个引用js的代码全部写在页面中是一样的,当系统找不到js文件的时候,就无法实现按钮触发等功能,而之所以系统找不到js文件,一是因为这个js根本就不存在,二是因为系统找到了两份一样的js,不知道到底是哪一份。这就相当于页面上有两个一模一样的方法,在写java代码的时候,方法完全相同的话系统一定会错误,而js是脚本语言只有运行的时候才会报错,所以我们无法在引用的时候就看到错误,只能是根据现象分析错误。

        如何避免下次不再出现这样的问题呢、下次在引用js的时候一定要注意看是否有冲突,这个页面引用的其他页面是否有冲突,通过这个问题来思考来改变。A君说的对,一句话,不要给自己现在的错误找理由, 要给自己未来的错误找解决办法。






js引用后界面无效,布布扣,bubuko.com

js引用后界面无效

上一篇:DIV+CSS布局


下一篇:jQuery->Deferred then