文章/答案/技术大牛

发布

社区首页 >问答首页 >有没有办法在Vue @click内联事件中执行原生JS？

问有没有办法在Vue @click内联事件中执行原生JS？
EN

Stack Overflow用户

提问于 2021-02-12 18:48:23

回答 1查看 52关注 0票数 2

我有一个包含以下元素的vue应用程序：

  <div @click="alert('test')"></div>

当然，这不会运行，我必须将警报放入vue方法中。但是..。有没有一种方法，即使是黑客攻击，也可以在@click事件内内联执行普通的Js函数，而不需要调用方法？

javascript

vue.js

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-02-12 19:05:08

证监会模板上下文中的this的作用域实际上是window，因此：

<div @click="this.alert('test')"></div>

都会起作用的。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/66177437

复制

jquery on绑定click事件执行多次

jquery

用$(document).on('click','#XX',function(){...})为元素添加点击事件结果导致事件会执行多次。出现这种情况是因为每点击一下document就会绑定一遍事件，click事件进行了累加绑定，每调用一次，便增加一次绑定，所以导致触发多次事件。

似水的流年

2020/09/11

4.3K0

js中click事件导致当前页面重新加载

jquery return

本意是计划用户不输入任何信息时，直接返回，但是实际结果却是没有任何提示而页面却无故重新加载，导致这个问题的原因是上面标红部分，上面标红部分的作用类似于return true，这句话就会导致当前页面重新加载，下面是正确的代码：

johnhuster的分享

2022/03/29

7.5K0

iview中 on-row-click 事件[通俗易懂]

java https 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/147151.html原文链接：https://javaforall.cn

全栈程序员站长

2022/07/01

1.4K0

JS篇(028)-移动端 click 事件、touch 事件、tap 事件的区别

jquery

1.click 事件在移动端会有 200-300ms 的延迟，主要原因是苹果手机在设计时，考虑到用户在浏览网页时需要放大，所以，在用户点击的 200-300ms 之后，才触发 click，如果 200-300ms 之内还有 click，就会进行放大缩小。

齐丶先丶森

2022/12/05

6.7K0

Vue.js-事件处理器原

vue.js javascript

方法事件处理器许多事件处理的逻辑都很复杂，所以直接把JavaScript代码写在v-on指令中是不可行的，因此v-on可以接收一个定义的方法来调用

tianyawhl

2019/04/04

9260

04-Vue入门系列之Vue事件处理

html https vue.js

摘要总结：本篇文章主要介绍了如何使用Vue.js实现网页中事件的绑定，包括普通事件、按键事件、鼠标事件和表单事件等。同时，还介绍了Vue.js提供的事件修饰符，以及如何使用Vue.js的指令绑定事件。

老马

2018/01/05

1.1K0

阻止js事件执行

javascript java

问题来自群里的一位骚年@い♂壹惢; 他的问题是：a下有一个checkbox a上绑定着两个事件：看代码；想要点击a的同时阻止tan()和href:javascript的执行;

田

2021/11/08

7.4K0

Vue进阶之事件处理器[通俗易懂]

javascript java https 网络安全 vue.js

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/108665.html原文链接：https://javaforall.cn

全栈程序员站长

2022/07/19

5580

自定义事件在 Vue.js 组件中的应用

input model native 事件

Vue.js 组件的自定义事件可以让子组件向父组件传递数据，非常方便实用。在使用自定义事件时，我们可以使用 v-on 来绑定事件，每个 Vue 实例都实现了事件接口，即使用 $on(eventName) 监听事件和使用 $emit(eventName) 触发事件。此外，在父组件中，我们可以使用 v-on 来监听子组件触发的事件。

iOS程序应用

2023/03/15

4K0

vue学习笔记-事件监听

编程算法

在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在方法中轻松实现这点，但更好的方式是：方法只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。

听着music睡

2020/02/21

4480

前端MVC Vue2学习总结（三）——模板语法、过滤器、计算属性、观察者、Class 与 Style 绑定

javascript vue.js

Vue.js 使用了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ，所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上， Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统，在应用状态改变时， Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。如果你熟悉虚拟 DOM 并且偏爱 JavaScript 的原始力量，你也可以不用模板，直接写渲染（render）函数，使用可选的

张果

2018/03/30

4.8K0

前端MVC Vue2学习总结（三）——模板语法、过滤器、计算属性、观察者、Class 与 Style 绑定

jquery 绑定click事件

jquery

有时候需要获得匹配元素相对于其同胞元素的索引位置，此时可以用index()方法获取

Devops海洋的渔夫

2019/05/30

4.5K0

vue指令用法

html

指令式带有 v- 前缀的特殊特性 v-text和v-html都属于指令将数据和dom做关联，当表达式的值改变时，响应式地作用在视图

达达前端

2019/11/03

8670

vue.js 事件

alert methods 对象函数事件

1.使用事件的第一种方式： <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <script type="text/javascript" src='vue.min.js'></

贵哥的编程之路

2021/03/02

6.2K0

vue.js中实现阻止事件冒泡

jquery

当父子元素中都有点击事件的时候，为了让触发子元素中的事件时，不去触发父元素中的事件，可以在子元素事件中添加stop来阻止事件冒泡。

唯一Chat

2022/10/31

6.7K0

VUE 四个常用选项

vue.js

过滤就是一个数据经过了这个过滤之后出来另一样东西，可以从中取得你想要的，或者给那个数据添加点什么装饰，那么过滤器则是过滤的工具。例如，从[‘abc’,‘abd’,‘ade’]数组中取得包含‘ab’的值，那么可通过过滤器筛选出来‘abc’和‘abd’；把‘Hello’变成‘Hello World’，那么可用过滤器给值‘Hello’后面添加上‘ World’；或者把时间节点改为时间戳等等都可以使用过滤器。

程序狗

2021/12/28

4710

input获取焦点原生js_原生js的input事件

java https 网络安全

2.onblur 当input失去焦点时触发，注意：这个事件触发的前提是已经获取了焦点再失去焦点的时候才会触发该事件，用于判断标签为空。

全栈程序员站长

2022/09/05

25.8K0

jQuery点击click()事件

jquery click 事件

<p>这是一个段落。</p> <button onclick="active()">切换</button> <script> $(document).ready(function(){ $("button").click(function(){ $("p").slideToggle(); }); function active(){ $("p").slideToggle(); } }); </script>

明知山

2020/09/03

9.9K0

原生JS中的拖拽事件兼容性问题

拖拽

写个小Demo，分享一下使用原生JS实现拖拽时的兼容性问题如何解决？代码如下： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>原生JS中的拖拽事件兼容性问题</title> <style> #div1 { width: 100px; height: 1

越陌度阡

2020/11/26

2.1K0

JS自定义事件原生

其他

说在开始，Javascript自定义事件类似设计的观察者模式，通过状态的变更来监听行为，主要功能解耦，易于扩展。多用于组件、模块间的交互。原型模式下的js自定义事件 var EventTarget = function() { this._listener = {}; }; EventTarget.prototype = { constructor: this, addEvent: function(type, fn) { if (typeof type =

空空云

2018/09/27

3K0

相似问题

Vue.js中的内联倒置布尔@click

有没有办法在click()事件结束后识别并执行代码？

有没有办法在Vue.js中动态插入点击事件？

291

有没有办法在c#中执行函数内联？

有没有办法让内联事件处理程序在元素创建后立即执行？

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

社区富文本编辑器全新改版！诚邀体验～

全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验

问有没有办法在Vue @click内联事件中执行原生JS？
EN