is not defined at HTMLInputElement.onclick

这篇具有很好参考价值的文章主要介绍了is not defined at HTMLInputElement.onclick。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

vue项目中一小部分功能想要使用原生的onclick 事件,发现报错

Uncaught ReferenceError: 函数名 is not defined at HTMLInputElement.onclick
is not defined at HTMLInputElement.onclick

搜索了相关blog,得出结论是

onclick事件调用的方法必须是全局变量或者说是window的方法

解决方法:将click方法定义为全局方法

window.clickfun = () => {}

参考来源:https://blog.csdn.net/weixin_43895819/article/details/124418469


在纯原生项目里测试,没有出现此报错(在window里有我们写的方法)

在index.html文件中写一个按钮,绑定aaa点击事件:

<input type="button" value="登录" onclick="aaa()"/>  

在showPic.js文件中写对应的方法,同时打印一下此时的window:

function aaa(){
    console.log('aaa事件调用了');
    console.log(window);
}

打印输出结果:

is not defined at HTMLInputElement.onclick

可以看到在window里有我们写的aaa方法,onclick事件能正常调用


综上,考虑onclick调用的方法可以是window的方法,

存疑:

  1. 全局方法和window方法的区别?2者说的是同一个东西吗?全局函数(在一个项目里各个文件都可用的函数)和这里的全局(window)不是同一个概念?

参考待阅读:

https://segmentfault.com/q/1010000042313553?utm_source=sf-similar-question

  1. vue中像上面showPic.js中写的方法为什么不在window下?是因为单页面组件中函数写在setup(){},不是全局方法?

参考:

https://blog.csdn.net/qq_38222534/article/details/110826356?spm=1001.2101.3001.6650.4&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-4-110826356-blog-83748166.pc_relevant_3mothn_strategy_and_data_recovery&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-4-110826356-blog-83748166.pc_relevant_3mothn_strategy_and_data_recovery&utm_relevant_index=5文章来源地址https://www.toymoban.com/news/detail-463716.html

到了这里,关于is not defined at HTMLInputElement.onclick的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • NameError: name ‘Image‘ is not defined

    Pycharm 报错“NameError: name ’ Image’is not defined” ##今天在运行代码时,出现了如下错误: 根据搜索,查到可以在anaconda prompt直接安装: 或者直接在pycharm搜索 但是我的能搜索到pillow,搜索不到image。并且pip install image 报错: 注意!!!关掉VPN!!! 再安装!! ###有博主提供

    2023年04月08日
    浏览(48)
  • 解决ESLint 报 ‘module‘ is not defined

    在需要使用CommonJS的文件头部使用: 在.eslintrc.cjs 文件里添加node环境变量 module.exports 改为 export default ESLint检查严格,默认不支持CommonJS语法,不过可以看到.eslintrc.cjs 文件就使用了/* eslint-env node */ 和 module.exports,真是让人饶头。

    2024年02月04日
    浏览(55)
  • 前端控制台报错is not defined

    背景: 前端控制台报错is not defined的bug,在一个页面渲染的模板里,多个接口都使用了同一个模板,但是接口返回的参数是不同的。有些接口返回了这个参数,另一些接口可能压根就没有这个参数。这个时候进行页面渲染,调用了那个不存在的参数,就报了is not defined的错。

    2024年02月08日
    浏览(53)
  • nuxt3 window is not defined错误

    问题 在 nuxt 中直接使用 window/document 会报 ReferenceError: window is not defined 原因 原因其实也比较简单,由于 nextjs 是服务端渲染,它会预渲染页面后生成 HTML,然后再将其发送给客户端,因此在渲染时无法识别 window/document 浏览器的对象方法。 解决方法,一 这个方法比较简单粗暴,

    2024年02月13日
    浏览(36)
  • 微信小程序错误----config is not defined

    微信小程序出错  请求头发生错误 修改  

    2024年02月22日
    浏览(45)
  • Uncaught ReferenceError: $ is not defined几种处理方式

    1.未引进JQuery的js文件,可以去JQuery官网下载 2.jquery的js文件路径错误,src后可以写相对路径或者绝对路径,推荐写绝对路径 script type=\\\"text/javascript\\\" src=\\\"bookjs/jquery.js\\\"/script 3.最郁闷的一种,浏览器中文件都能读取,但是就是不能调用,代码顺序问题,应该先引用jquery.js文件,再

    2024年02月07日
    浏览(50)
  • Vue is not defined错误的几种可能

     当出现vue is not defined  at ,有以下几种情况发生: 检查方法: 上方是vue3,下方是vue2,因为我下载的是vue2模式,所以启用vue2模式就可以了 点击vue2的详情,开启访问文件地址功能,查看是否允许访问  因为我之前一直引用的是相对地址,一直显示Vue is not defined的问题,改成

    2024年02月11日
    浏览(38)
  • SyntaxError: future feature annotations is not defined

    SyntaxError: future feature annotations is not defined 语法错误:没有定义future feature注释 实际上是python版本不对,该语法需要在python3.7以上,而当前版本在python3.6所以导致此错误! 如果因为无法及时安装,临时将以下注释掉也可以运行当前代码

    2024年01月17日
    浏览(42)
  • 【Python】报错:NameError: name ‘By‘ is not defined

    目录 一、报错情况 二、报错解读 三、报错解决

    2024年02月11日
    浏览(70)
  • Angular之创建项目报错:setTimeout is not defined

    零基础的宝们,跟着视频学习Angular中,会教授大家如何创建一个新项目。 但是在操作时就会遇到无法创建的问题。 接下来我们一起来看看,本人Angular起步时卡在家门口的问题。 在已经安装了nodejs的情况下,被建议使用cnpm命令全局安装 Angular CLI cnpm install -g @angular/cli 它是这

    2024年02月16日
    浏览(33)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包