vue 中拼接html时添加点击事件

在vue 的html拼接在添加点击事件用原生的onclick来触发事件,将事件挂在window上

<template>
<div>

<el-button @click="hahha">
添加
</el-button>
<div style="height:500px;width:1000px;background:#666;" class="circle">
1111
</div>

</div>
</template>
<script>
export default {
data() {
return {
tooltip:"test",

};
},
methods: {
hahha(){
var item=this
debugger
item.tooltip
var circle = $(".circle");
// onclick=atlas_edit('+v.pk_atlas_main+',"'+v.name+'") '+onclick=bimshowinfo() +'
circle[0].innerHTML=`<div class="leadTips"><img src="http://static.bimface.com/attach/24ce9654e88a4218908f46279e5c4b04_line.png" height="35" width="49"/><div class="leadText"><span class="canvspna"><span style="display: block;float:left">${item.tooltip}</span> <span style="display: block;float:right;color:#3aa1fe;cursor: pointer;;"></i><i class="iconfont icon-hao1" style="margin-left:10px;margin-right:20px;font-size:25px;" onclick="closebimface()" ></i> </span></span><div id="canvasDiv" class="ecanvasDiv"></div></div></div>`
window.closebimface =function(){
console.log("ssss")
}
},

},

};
</script>
<style >

.leadTips {display: flex; justify-content: start; width: auto; transform: translateY(-40px);width:1000px;height:300px;}
.leadTips img {display: inline-block; width: 49px; height: 40px}
.leadText {display: block; background: #fff; color: #fff; padding: 10px;width:800px;height: 300px;}
.ecanvasDiv{width:800px;height: 280px;}
.canvspna{
width: 785px;
height: 28px;
line-height: 28px;
color:#409eff;
}
</style>

 

原创:https://www.panoramacn.com
源码网提供WordPress源码,帝国CMS源码discuz源码,微信小程序,小说源码,杰奇源码,thinkphp源码,ecshop模板源码,微擎模板源码,dede源码,织梦源码等。

专业搭建小说网站,小说程序,杰奇系列,微信小说系列,app系列小说

免责声明,若由于商用引起版权纠纷,一切责任均由使用者承担。

您必须遵守我们的协议,如果您下载了该资源行为将被视为对《免责声明》全部内容的认可-> 联系客服 投诉资源
www.panoramacn.com资源全部来自互联网收集,仅供用于学习和交流,请勿用于商业用途。如有侵权、不妥之处,请联系站长并出示版权证明以便删除。 敬请谅解! 侵权删帖/违法举报/投稿等事物联系邮箱:2640602276@qq.com
未经允许不得转载:书荒源码源码网每日更新网站源码模板! » vue 中拼接html时添加点击事件
关注我们小说电影免费看
关注我们,获取更多的全网素材资源,有趣有料!
120000+人已关注
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

您的打赏就是我分享的动力!

支付宝扫一扫打赏

微信扫一扫打赏