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

   日期:2020-04-29     浏览:93    评论:0    
核心提示:在vue 的html拼接在添加点击事件用原生的onclick来触发事件,将事件挂在window上&lJavaScript

在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>

 

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服