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

错误一: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&…

默认HotSpot最大直接内存大小

在我以前的博客文章热点选项中的Java 8改进的文档 &#xff0c;我写的误解围绕热点JVM非标准的默认设置选项 -XX:MaxDirectMemorySize 。 在本文中&#xff0c;我介绍了一种确定HotSpot JVM中“默认”最大直接内存大小的简单方法。 Java启动器的Java 8文档针对-XX:MaxDirectMe…

window 下 Atom 侧边栏字体大小设置

在 File 处找到 Settings 点击找到 Themes 点击找到 your stylesheet 点击在 .tree-view 处设置即可, (按照 css 样式来写即可保存生效)。转载于:https://www.cnblogs.com/zhourongcode/p/8521317.html

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

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

python面向对象封装

封装是指将功能模块化&#xff0c;比如&#xff0c;我们写了一个求和函数就是封装&#xff0c;函数使用者不需要了解函数内部是如何实现求和的&#xff0c;只需要调用我们写好的函数就行了。把很多数据封装到一个对象中&#xff0c;把固定功能的代码封装到一个代码块&#xff0…

Java嵌入oracle,Java插入Oracle Spatial空间数据

Java读取地理信息数据文件&#xff0c;并将其存入Oracle数据库。package file;import java.io.BufferedReader;import java.io.File;import java.io.FileReader;import java.io.IOException;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.Res…

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,//…

SpringBoot AutoConfiguration魔术如何工作?

在我以前的文章中&#xff0c; 为什么选择SpringBoot&#xff1f; 我们已经研究了如何创建SpringBoot应用程序。 但是您可能会也可能不会了解幕后发生的事情。 您可能想了解SpringBoot自动配置背后的魔力。 但是在此之前&#xff0c;您应该了解Spring的Conditional功能&#x…

linux常用网络命令详解,linux网络命令详解(鸟哥)

[rootlinux ~]# tcpdump [-nn] [-i 介面] [-w 儲存檔名] [-c 次數] [-Ae][-qX] [-r 檔案] [所欲擷取的資料內容]參數&#xff1a;-nn&#xff1a;直接以 IP 及 port number 顯示&#xff0c;而非主機名與服務名稱-i &#xff1a;後面接要『監聽』的網路介面&#xff0c;例如 et…

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…

JUnit 5 –下一代JUnit的初步了解

2月初&#xff0c; JUnit 5&#xff08;又名JUnit Lambda&#xff09;团队发布了一个alpha版本。 由于JUnit 4是我工具箱中使用最频繁的项目之一&#xff0c;因此我认为值得一看下一个主要版本。 我试用了最新版本&#xff0c;并记下了我在这里发现值得注意的更改。 安装JUni…

Geany——Python配置

Geany是一个很不错的编辑器&#xff0c;操作很简单&#xff0c;这里记录一下Geany的入手设置&#xff08;在下是一个Python程序猿&#xff0c;就以Python为例&#xff09;&#xff1a; 1&#xff1a;新建&#xff1a;选择 下拉菜单中的 main.py &#xff0c;然后就能生成Pyth…

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

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

cargo maven_用于集成测试的Maven Cargo插件

cargo maven在项目生命周期中&#xff0c;非常普遍的需求是设置集成测试。 幸运的是&#xff0c;Maven在默认构建生命周期的以下阶段&#xff08;来自Maven 文档 &#xff09;具有对这一确切方案的内置支持&#xff1a; 集成前测试 &#xff1a; 执行集成测试之前所需的操作。…

linux菜单系统,Linux修改grub菜单

1. 保留上一次 grub 菜单选项1.1 问题每次开机时&#xff0c;大部分 Linux 发行版的 grub 菜单都是定位在首选项位置(即当前系统选项位置)。这就导致如果我们电脑安装了多个系统&#xff0c;那么每次开机进入其他系统都要重新选择 grub 菜单选项。而我们一般都是一段时间固定使…

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系统调用的实现机制. ) ,参考了《深入理解计算机系统》和一些网上的资料…

jqGrid 常用方法

方法名参数返回值说明addJSONDatadatanone使用传来的data数据填充表格。使用方法&#xff1a; var mygrid jQuery(”#”grid_id)[0]; var myjsongrid eval(”(”jsonresponse.responseText”)”); mygrid.addJSONData(myjsongrid); myjsongrid null; jsonresponse null;addR…