前端项目里常见的十种报错及其解决办法

错误一:Uncaught TypeError: Cannot set property 'onclick' of null

at operate.js:86
图片.png

原因:
当js文件放在head里面时,如果绑定了onclick事件,就会出现这样的错误,是因为W3School的写法是浏览器先加载完按钮节点才执行的js,所以当浏览器自顶向下解析时,找不到onclick绑定的按钮节点,于是报错。因此,需要把js文件放在底部加载,就会避免该问题。

解决办法:用window.οnlοad=function(){}包裹起来就不会出现这个错误了,因为浏览器要先加载节点才可以用onclick。

错误二:Uncaught TypeError: $(...).none is not a function

at HTMLLIElement.<anonymous> (operate.js:66)
at HTMLLIElement.dispatch (jquery.min.js:5)
at HTMLLIElement.y.handle (jquery.min.js:5)
图片.png

Query 1.9 比之前的版本做了很大的调整,很多函数都不被支持
none()方法已经失效,需要改成以下方式

错误三:Failed to load resource: the server responded with a status of 500 (Internal Server Error)

图片.png

只是注释了js里面隔行换色的代码,表格就加载不出来了,按f12键查看控制台network,按F5刷新如下


图片.png

对于这种莫名其妙,上一秒还能正常显示,这一秒就出现了错误的bug,我通常重启一下编辑器,重启一下浏览器,就正常了,不要问我为什么,我拿这种蜜汁bug也没有办法

错误四:最常见:Failed to load resource: the server responded with a status of 404 (Not Found)

图片.png

文件没有被找到,说明文件引用的路径有问题,或文件损坏

错误五:tomcat启动报错处理:Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at localhost are already in use

图片.png

8080端口被占用
将配置文件里面被占用的端口名改掉:


图片.png

做一个项目的时候 ,控制台总是会出现各种bug,其实不用慌张,终结起来也就几种类型的错误,在开发中每次遇到错误都善于总结,下次在看到就会胸有成竹知道是什么情况了,以下是在开发过程中总结的一些错误以及错误的解决方法。

报错六:Uncaught ReferenceError: $ is not defined

Uncaught ReferenceError: $ is not defined
Uncaught ReferenceError: jQuery is not defined
图片.png

错误原因:文件加载的顺序不对,jQuery文件的顺序要在前面


图片.png

方法:把jQuery文件写在所有script文件前面


图片.png

报错七:jsp页面相对路径和绝对路径的问题:

正常路径:html里面的../../,改成jsp页面就找不到路径了,这个时候成了这个鬼样子

图片.png

这时候,只需要在文件里面加入这段代码:


图片.png

解决办法:在<html>和<head>之间插入以下代码

<%String path = request.getRequestURI();String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path;
%>
<base href="<%=basePath%>">

报错八:Uncaught TypeError: $(...).tooltip is not a function

Uncaught TypeError: $(...).tooltip is not a functionat HTMLDocument.<anonymous> (app.js:42)at l (jquery.min.js:4)at Object.fireWith [as resolveWith] (jquery.min.js:4)at Function.ready (jquery.min.js:4)at HTMLDocument.S (jquery.min.js:4)
图片.png

原因:包括两个不同版本的jQuery UI。这可能会导致冲突。尝试删除

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

解决办法:
编辑:

<script>
jQuery( document ).ready(function( $ ) {$('.hasTooltip').tooltip();
});
</script>

像这样使用它,解决了我的问题!

报错九:Uncaught TypeError: $(...).sortable is not a function

Uncaught TypeError: $(...).sortable is not a functionat HTMLDocument.<anonymous> (dashboard.js:12)at l (VM552 jquery.min.js:4)at Object.fireWith [as resolveWith] (VM552 jquery.min.js:4)at Function.ready (VM552 jquery.min.js:4)at HTMLDocument.S (VM552 jquery.min.js:4)

报错十:bootstrap.min.js:7 Uncaught Error: Bootstrap requires jQuery

bootstrap.min.js:7 Uncaught Error: Bootstrap requires jQueryat bootstrap.min.js:7
图片.png

解决方案:解决方案:将jquery.min.js放在bootstrap.min.js文件之前引用,bootstrap.min.css文件在整两个文件前后引用都无妨(测试多次)。

原文作者:祈澈姑娘
原文链接:https://www.jianshu.com/u/05f416aefbe1
创作不易,转载请告知

90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。
有个很难涨粉的的公众号叫:【编程微刊】


转载于:https://www.cnblogs.com/wangting888/p/9701765.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/354037.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

监控oracle数据io,Prometheus监控Oracle数据库

背景本文简单介绍下&#xff0c;Prometheus如何通过exporters监控Oracle数据库&#xff0c;以及应该注意哪些指标。oracledb_exporteroracledb_exporter是一个连接到Oracle数据库并生成Prometheus metrics的应用程序&#xff0c;设置展示下如何安装和设置oracledb_exporter&…

php workman 多线程,workerman如何多线程

Workerman有一个依赖pthreads扩展的MT多线程版本&#xff0c;但是由于pthreads扩展还不够稳定&#xff0c;所以这个Workerman多线程版本已经不再维护。 (推荐学习&#xff1a; workerman教程)workerman\mqtt 是一个基于workerman的异步mqtt 客户端库&#xff0c;可用于接收或者…

js Object的属性 Configurable,Enumerable,Writable,Value,Getter,Setter

对象的数据属性 Configurable,Enumerable,Writable,Value var person {} Object.defineProperty(person,name,{configurable:false,//能否使用delete、能否需改属性特性、或能否修改访问器属性、&#xff0c;false为不可重新定义&#xff0c;默认值为true enumerable:false,//…

Bzoj2694/Bzoj4659:莫比乌斯反演

Bzoj2694/Bzoj4659:莫比乌斯反演先上题面:首先看到这数据范围显然是反演了&#xff0c;然而第三个限制条件十分不可做。于是我们暂且无视他&#xff0c;大不了补集转化算完再减是吧。于是我们有:这里我们定义:于是这个东西我们可以nlogn筛的说。也就是说&#xff0c;我们求出f的…

linux系统嵌入式编译环境,Ubuntu 12.04嵌入式交叉编译环境arm-linux-gcc搭建过程图解...

Linux版本&#xff1a;Ubuntu 12.04 内核版本&#xff1a;Linux 3.5.0 交叉编译器版本&#xff1a;arm-linux-gcc-4.4.3 交叉编译器下载 见这篇文章http://www.linuxidc.com/Linux/2011-05/35906.htm安装前的絮叨首先简单介绍一下&#xff0c;所谓的搭建交叉编译环境&#xff0…

linux权限drwx,linux权限基础知识详解

祥哥今天整理一下Linux系统中的权限到底是什么&#xff1f;什么是775&#xff1f;什么又是777&#xff1f;664又代表了什么&#xff1f;1.查看权限可以使用ls -l命令ls -l我们以root文件夹为例来说明&#xff1a;drwx------.2 root rootd:这个代表是目录&#xff0c;也就是文件…

zookeeper zoo.cfg配置文件

一、zookeeper的配置文件 zoo.cfg 配置文件是我们安装zookeeper的时候复制 重命名出来的文件命令&#xff1a; cp zoo_smaple.cfg zoo.cfgzkServer.sh 获取执行进入zookeeper 查看配置文件cd /myapp/zookeeper/conf执行命令 查看配置文件信息命令&#xff1a;vim zoo.cfg这是…

与Spring和Maven签订合约优先SOAP服务

1.简介 在本教程中&#xff0c;我们将学习使用JAX-WS&#xff0c;Spring和Maven实施合同优先的SOAP服务应用程序。 这是使用合同优先还是代码优先方法的更多设计决定。 在开发基于SOAP的Web服务应用程序时使用应用合同优先的方法最显着的好处是&#xff0c;可以在对合同进行必…

linux 下c内存管理,linux内存管理之malloc

对于内核的内存管理&#xff0c;像kmalloc&#xff0c;vmalloc&#xff0c;kmap&#xff0c;ioremap等比较熟悉。而对用户层的管理机制不是很熟悉&#xff0c;下面就从malloc的实现入手.( 这里不探讨linux系统调用的实现机制. ) ,参考了《深入理解计算机系统》和一些网上的资料…

新生必会的linux命令,jstat命令详解

导读Jstat是JDK自带的一个轻量级小工具。全称“Java Virtual Machine statistics monitoring tool”&#xff0c;它位于java的bin目录下&#xff0c;主要利用JVM内建的指令对Java应用程序的资源和性能进行实时的命令行的监控&#xff0c;包括了对Heap size和垃圾回收状况的监控…

linux 天文软件,新闻|开源新闻速递:天文软件 Stellarium 0.15.0 发布

今日关注Stellarium 0.15.0 发布。这是一款全世界最棒的免费、开源、跨平台的天文软件应用&#xff0c;用户可以通过该软件来观看实时的星星、行星还有星云。最新版本进行了非常多的功能完善&#xff0c;修复了若干bug&#xff0c;新增了许多新特性。比如更新了AstroCalc工具&a…

linux javaweb环境单价,linux(centos)下Java Web环境开发

一、安装jdk百度搜索jdk&#xff0c;进入http://www.oracle.com/technetwork/java/javase/downloads/index.html找到自己需要版本的jdk的Linux压缩包&#xff1b;复制出这个压缩包的下载地址(尽量先点击下载&#xff0c;然后在下载的界面复制出资源的链接)在服务器的合适位置创…

带有Java Util日志记录的Java 8延迟调用

在博客文章“在Log4j2中更好地执行非日志记录器调用”中 &#xff0c;我介绍了可以在Log4j 2中使用的方法&#xff0c;这些方法可以减少或避免在基于指定日志级别实际上根本未记录的日志语句中调用方法。 作为讨论的一部分&#xff0c;我介绍了Log4j 2对使用lambda表达式的基于…

python对象分类

1 python对象分类 所有的Python对象都拥有三个特性&#xff1a;身份&#xff0c;类型和值 身份&#xff1a; 每一个对象都有一个唯一的身份标识自己。任何对象的身份可以使用内建函数id()来得到。这个值可以被认为是该对象的内存地址类型&#xff1a; 对象的类型决定了对象可以…

怎样用u盘linux安装ntp协议,电脑中怎么配置NTP服务

NTP服务器是用来使计算机时间同步化的一种协议&#xff0c;可提供高精准度的时间校正&#xff0c;而且能通过加密确认来防止恶毒的协议攻击。下面让学习啦小编为大家介绍如何在电脑中配置NTP服务来实现局域网内设备的时间同步。电脑中怎么配置NTP服务1、先关闭Windows系统自带的…

SetGID 权限

一、SetGID针对文件的作用 1、只有可执行的二进制程序才能设置SGID权限 2、命令执行者要对该程序拥有 x &#xff08;执行&#xff09;权限 3、命令执行在执行程序的时候&#xff0c;组身份升级为该程序的属组 4、SetGID权限同样只在该程序执行过程中有效&#xff0c;也就是说组…

jsf组件不显示_JSF组件库–质量不只是零缺陷

jsf组件不显示自从我上次查看三个主要JSF组件库的质量以来已经有一段时间了。 在2009年12月&#xff0c;我开始比较RichFaces&#xff0c;Primefaces和ICEfaces的整体软件质量 。 从那时起&#xff0c;事情发生了变化&#xff0c;从现在开始&#xff0c;我想重新评估和更新它。…

linux安装mysql(shell一键安装)

1. 相关文件&#xff08;install_mysql.sh、my.cnf、mysqld相关内容在文中最后面&#xff09; 2. 将上面的文件上传到linux服务器某一目录下 3.给install_mysql.sh赋执行权限 # chmod x instll_mysql.sj 4. 执行install_mysql.sh # ./install_mysql.sh 5. 验证 6. install_mysq…

c语言编译时检查逻辑错误吗,C语言陷阱与技巧20节,自定义“编译时”assert方法,在代码编译阶段检查“逻辑”错误...

在C语言程序开发中&#xff0c;程序员写代码时应该考虑的“面面俱到”&#xff0c;这样才能写出功能稳定的程序。例如&#xff0c;在实现 open() 函数时&#xff0c;先完成它的功能固然是重要的&#xff0c;但是程序员还需要考虑各种“意外”&#xff0c;比如下面这种情况。假设…

影场与属性访问器界面

卡尔迪亚&#xff08;Carl Dea&#xff09;最近跟踪了我的一篇名为“ 保存内存”的博客文章&#xff01; 为属性使用阴影字段 。 在他的博客中&#xff0c;他建议使用一个称为“属性访问器”的接口来消除使用阴影字段所需的大量样板代码。 卡尔还提到他尚未用大量数据测试他的方…