拼接的html点击事情不触发,关于在vue中拼接html的问题,点击事件无法执行

首先是在普通文档(也就是单个html文件中进行测试,能够正常执行)

14f87015eb62031cdd10f1bbc5881ab4.png

7a4758f61739ae82b1b6fbaaaeed740b.png

普通情况下的结果,拼接的结果能够正常渲染并且控制台有输出;

b1129bb5494f78f7d17c59f5cd4699f7.png

201d69b7d865aee119ff9d9e08262a1d.png

但是在vue环境之下就会出错,点击事件并没有反应,

js部分:

for (const i in _sourcesName) {

let liHtml = "";

for (const j in _sourcesName[i]) {

liHtml += ‘

‘;

liHtml +=

‘ +

_sourcesName[i][j] +

‘(‘ +

_sourcesRoundNum[i][j] +

‘)‘ +

‘;

liHtml += ‘最近更新: ‘ + _sourcesTime[i][j] + ‘‘;

liHtml += ‘

‘;

}

if (i == 0) {

$("#list0").append(liHtml);

} else if (i == 1) {

$("#list1").append(liHtml);

} else if (i == 2) {

$("#list2").append(liHtml);

} else if (i == 3) {

$("#list3").append(liHtml);

} else if (i == 4) {

$("#list4").append(liHtml);

}

}

/**点击li下面的p获取不同表格信息 */

showList() {

console.log("1111");

const _this = this;

// $(".dataLi p").click(function() {

// _this.open3();

// console.log("点击获取列表");

// });

$(".dataLi").on("click","p",function(){

console.log("点击获取列表");

});

// let tabList = $("#tab");

// tabList.css("display", "block");

// this.DQZY=

},

template部分

结果是页面可以渲染,但是事件不会成功,能够进入输出“1111”,但是点击事件没有进入,我觉得应该是渲染的时间问题,目前还没有解决。

原文:https://www.cnblogs.com/zaco/p/12169951.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值