报错：Uncaught TypeError: $(…).dialog is not a function，处理方法。

最新推荐文章于 2021-06-09 10:11:40 发布
最新推荐文章于 2021-06-09 10:11:40 发布
阅读量1.7w 收藏 1
点赞数 3
分类专栏： 原创 文章标签： 前端 函数 编程语言 js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_40125777/article/details/77870630
版权
本文介绍了一种在前端开发中遇到的常见问题——使用jQuery dialog插件时报错的情况，并给出了具体的解决方案，即确保所有必需的CSS和JS文件已正确导入。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在写前端queryselfplan.js代码时运用   
$.dialog({
	       		type: 'alert',
	        	content: '该计划未创建'
	   	 });

报错：Uncaught TypeError: $(…).dialog is not a function


这时候查了很多资料，发现原因是jsp页面有css和js包没有导入，导包如下：


将以上包导入后，窗口正常弹出。

TypeError: $(...).dialog is not a function debug过程
全名工作狂的小城堡
10-19 8325
当你的项目里有运用到bootstrap和jquery UI两个JS插件的时候，你就知道错了……二者在很多方面都会存在冲突，比如我遇到一个问题debug了很久，错误如下： TypeError: $(...).dialog is not a function 根据stackoverflow上的解释，都是说jquery.js重复。然而我找了半天，都没有发现我有重复的地方。后来突然想到，是不是jque
ajax上传文件附带参数问题之 $(...).dialog is not a function
小菜菜菜菜菜菜的博客
12-05 1275
1、先引用两个包 jquery-1.8.0.min.js和ajaxfileupload.js 2、再上传文件（这里是上传excel）和附带的参数（id）， html js File.upLoadFile=function(){ var id= document.getElementById("pipeImportId")
使用jQuery dialog前端报错Uncaught TypeError: $(…).dialog is not a function，解决方法
sinat_34524133的博客
10-09 5503
正确引入js和css文件 <script type="text/javascript" src="js/jquery-3.5.1.js" ></script> <script src="js/jquery-3.5.1.min.js"></script> <script src="js/jquery-ui.min.js"></script> <script src="js/jquery-ui.js"></script
jQuery UI dialog插件出错信息:$(this).dialog is not a function
02-19 178
使用jQuery UI 1.7.2 dialog插件，遇到这样的错误： [img]http://dl.iteye.com/upload/attachment/308166/97c428e4-2ce2-367e-b4df-4c4da7686b95.bmp&quot; alt=&quot;&quot; width=&quot;210&quot;...
jquery dialog load页面时.dialog is not a function
记录，学习。
05-08 2569
在用jquery的dialog效果时，在父页面中弹出样式load一个子页面，在点击关闭之后，重新load就报错说 $("#youId").dialog is not a function   从网上找到答案。是因为子页面中引用了jquery的js。
Uncaught TypeError: $(...).customFileInput is not a function
游海东的技术专栏
08-10 4999
1、错误描述demo.js:214 Uncaught TypeError: $(...).customFileInput is not a function at HTMLDocument. (demo.js:214) at f (jquery-1.9.0.min.js:1) at Object.fireWith [as resolveWith] (jquery-1.9.0
Uncaught TypeError: antd_es_form__WEBPACK_IMPORTED_MODULE_9__.default.create(...) is not a function
weixin_40460171的博客
12-30 3219
报错信息 login.jsx:111 Uncaught TypeError: antd_es_form__WEBPACK_IMPORTED_MODULE_9__.default.create(...) is not a function 网上查到的解法一 原因：由于antd的版本导致 解决：package.json文件下的antd版本号修改为3.26.14 我的版本【“antd”: “^4.9.4”,】 网上查到的解法二 Ant Design 4.0 对Form进行了修改，已经不使用 Form.c
struts-2.3.33-lib.zip
08-16
struts2官网2.3版本的最后一个版本，能够满足网络上基于struts2 的2.3版本的示例源码开发。注意此版本的dispatcher是org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter。...
vue 父组件调用子组件的方法报错，“TypeError: Cannot read property ‘subDialogRef‘ of undefined“
u013474230的博客
06-09 4079
vue 父组件调用子组件的方法报错，“TypeError: Cannot read property ‘subDialogRef’ of undefined” 最近用vue做的一个界面，引入了一个子组件，在父组件中调用子组件的方法时，报错提示： [Vue warn]: Error in v-on handler: “TypeError: Cannot read property ‘methods’ of undefined” 子组件中定义的方法如下： export default { data(){
Uncaught TypeError: Cannot read property 'msie' of undefined
游海东的技术专栏
08-09 2574
1、错误描述Uncaught TypeError: Cannot read property 'msie' of undefined2、错误原因3、解决办法
jQuery UI dialog插件出错信息:$(this).dialog is not a function及js引入重复解决办法
热门推荐
一窍不通只会复制粘贴的Java工程师
08-12 1万+
$(this).dialog is not a function js一直报这个错误 ，需要引用的js 插件 也全部引用 但还是报错 找了 好久 后来发现是一样的js 插件引入了两次 因为一个页面引入了另一个jsp  里面也有引用相同的js  删除重复的js插件
$('#dlg').dialog('open') is not a function
zxh的专栏
06-27 2539
$('#dlg').dialog('open')  is not a function   如果已经导入了jqurey.js包，那么可能就是因为jquery的版本问题了，如果版本太高，就没有那个方法。尝试用低点的包。
easyui使用dialog时报错dialog is not a function
weixin_45218651的博客
06-05 915
百度之后发现是因为多次加载jquery/各页面加载jquery版本不一致/更换jquery版本/清除缓存/easyui与bootstrap冲突，于是仔细检查了自己的代码，终于在body里发现是自己不知道什么时候加了个jquery的在线引用 将script这部分注释掉就没问题了 ...
$ is not defined、$.dialog() is not function、$(...).ajaxsubmit() is not function
熊浪的博客
10-10 4960
今天用easyUI弹一个dialog在用ajax提交表单，因为字段过多，所以要进行封装，所以就想到了jquery的ajaxsubmit提交。 首先报错为$ is not defined 这是因为jquery.js没有引用，但查一下引用了，后来发现前面引用的js文件用了jquery.js框架，原来是没有第一个引用，后来把它放到第一 之后又报$.dialog() is not function，首
【疑难杂症01】TypeError: alert is not a function
weixin_30894389的博客
12-13 4057
一、背景 　　话说今天在调试js的时候，碰到一个很奇怪的问题，现记录一下。当使用alert()函数弹出提示时，总是报错，你没看错，alert函数报错了。 二、详细说明 　　当时正在做一个关于告警的页面展示功能，其中一段js为： function search(){ var startTime=$("#startTime").val(); var endTime=$(...
chrome浏览器报错Uncaught TypeError: window.showModalDialog is not a function
u010805109的博客
12-15 3511
ie浏览器进入网页能够正常弹出页面，但是进入chrome无法弹出。 目的主要是能够读取前端代码，实现rpa目标的获取。实际还是需要在ie浏览器下面执行流程。 console控制台输入下面的代码就会弹出对话框 if(window.showModalDialog == undefined){ window.showModalDialog = function(url,mixedVar,features){ window.hasOpenWindow = true; if(mixedVar) var mixed
window.showModalDialog 在谷歌Uncaught TypeError: undefined is not a function
独孤求梦
11-20 9915
if(navigator.userAgent.indexOf("Chrome") >0 ){ var winOption = "height="+height+",width="+width+",top=50,left=50,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'show')
最新发布
02-22
<think>嗯，用户遇到了一个JavaScript的错误信息：“Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'show')”。我需要帮他们理解这个问题。首先，这个错误说明在某个Promise中发生了未捕获的类型错误，试图读取未定义对象的'show'属性。 我应该先解释错误的结构。Uncaught (in promise)意味着错误发生在Promise链中，没有被.catch()处理。TypeError指出类型问题，这里是因为某个变量是undefined，但用户试图访问它的'show'属性。 接下来，可能的原因。常见的情况是对象未被正确初始化，比如变量在调用show方法时是undefined。可能的情况包括异步操作未完成前访问对象，比如API请求还没返回数据就调用方法；或者方法调用时对象尚未实例化，比如未正确绑定this的类方法。 然后，需要提供解决步骤。首先检查调用show的地方，确认对象是否存在。可以用console.log或调试工具查看对象是否定义。如果是异步操作，确保在数据返回后才调用方法，比如在.then()里或async/await中处理。另外，检查变量作用域和生命周期，确保对象在需要时已正确初始化。 如果是类的方法，可能需要绑定this，或者检查是否正确实例化了对象。例如，使用new关键字创建实例，避免丢失上下文。还可以添加错误处理，用try/catch或.catch()来捕获Promise中的错误，避免未捕获的异常。 最后，给出示例代码，比如异步操作中的正确处理，类方法的绑定等。帮助用户具体理解如何应用这些解决方法。同时提醒用户注意代码逻辑，特别是在处理异步数据时的顺序问题。</think>这个错误信息 `Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'show')` 是 JavaScript 运行时常见的错误，通常发生在以下场景中： --- ### **错误含义** 1. **`Uncaught (in promise)`**：表示错误发生在一个未被捕获的 Promise 异步操作中（比如 `async/await` 或 `.then()` 链）。 2. **`Cannot read properties of undefined`**：尝试访问 `undefined` 值的属性（此处是 `show`）。 3. **`reading 'show'`**：具体试图访问的属性名是 `show`。 **翻译成白话**：你试图调用某个对象的 `show` 方法（或属性），但这个对象本身是 `undefined`（不存在）。 --- ### **常见原因** #### 1. **异步操作未正确等待** ```javascript async function fetchData() { const data = await api.get(); // 假设 data 可能返回 undefined data.show(); // 如果 data 是 undefined，会抛出此错误 } ``` - **问题**：`data` 可能未正确初始化（如接口返回空值）。 - **解决**：添加空值检查（`data?.show()` 或 `if (data) data.show()`）。 #### 2. **对象未正确初始化** ```javascript class Dialog { show() { /* ... */ } } const dialog = Dialog(); // 忘记写 new，dialog 是 undefined dialog.show(); // 抛出错误 ``` - **问题**：未使用 `new` 关键字实例化对象。 - **解决**：`const dialog = new Dialog();` #### 3. **事件监听或回调函数中的 `this` 丢失** ```javascript class Component { show() { /* ... */ } handleClick() { someButton.addEventListener("click", this.show); // this 指向错误 } } ``` - **问题**：`this` 指向的不是类实例。 - **解决**：绑定上下文 `this.show = this.show.bind(this)` 或使用箭头函数。 #### 4. **第三方库未正确加载** - 如果 `show` 是第三方库（如 UI 框架）的方法，可能因库未加载完成就调用导致错误。 --- ### **调试步骤** 1. **定位错误位置**：浏览器控制台会显示错误发生的文件和行号。 2. **检查对象是否存在**：在调用 `show()` 前，用 `console.log(object)` 确认对象是否已定义。 3. **检查异步流程**：如果是异步操作（如接口请求），确保在数据返回后再调用方法。 4. **使用可选链（Optional Chaining）**： ```javascript object?.show(); // 如果 object 是 undefined，不会报错 ``` --- ### **示例修复** ```javascript // 修复前（可能报错） async function init() { const response = await fetchApi(); // 假设可能返回 undefined response.show(); // 直接调用 } // 修复后 async function init() { const response = await fetchApi(); if (response) { response.show(); // 安全调用 } } ``` --- ### **总结** 此错误的本质是 **代码试图操作一个不存在的对象**，重点检查： 1. 异步操作是否正确等待。 2. 对象是否被正确初始化。 3. 作用域和 `this` 绑定问题。 4. 使用防御性编程（空值检查、可选链）。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值