vue在v-html中绑定的点击事件失效处理方法
主要代码如下:
vue中代码
/*@autor:dantaxiaozi @time:2021/4/28 @desc: 解决v-html中点击事件无效的方法*/ <template> <div id="announcementList"> <div class="affiche_text"> <p v-html="textContent" @click="triggerClick"></p> </div> </div> </template> <script> export default { name: "announcementList", props: {}, data() { return { textContent:"测试vue中v-html中绑定点击事件"+"<a style='padding-left:15px;' href='###' class='testClass' id=" + 10001 + ">【详细】</a>", }; }, filters: {}, computed: {}, created() { }, mounted() { }, beforeDestory() { }, methods: { // 触发v-html中的点击事件 triggerClick(event) { console.log("获取标签名="+event.target.className) // 获取标签名 console.log("获取class属性名="+event.target.nodeName) // 获取class属性名 console.log("获取id值="+event.target.id) // 获取id值 } } }; </script>
实测有效
本文来自博客园,作者:沉迷编程的程序员,转载请注明原文链接:https://www.cnblogs.com/codeDevotee/p/15404041.html
欢迎各位找我代写程序,python、c#、web等都可以,加我请注明博客园微信:A15919195482
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步