// js loop load dom for (var k in data) { var v = data[k]; detailTemplate = detailTemplate.cloneNode(true); var userInfoObj = detailTemplate.getElementsByClassName('user-info')[0]; userInfoObj.getElementsByClassName('name')[0].innerText = v.author; userInfoObj.getElementsByClassName('avatar')[0].src = v.avatar; userInfoObj.getElementsByClassName('post-time')[0].innerHTML = v.lastpost; var titleObj = detailTemplate.getElementsByClassName('title')[0]; titleObj.innerText = v.subject; var commentHtml = ''; if (v.postlist.length > 0) { for (var j in v.postlist) { var vv = v.postlist[j]; commentHtml += '<div class="line"><i class="icon icon-quote"></i><span class="desc">' + vv.message + '</span></div>'; } } var commentObj = detailTemplate.getElementsByClassName('comment')[0]; commentObj.innerHTML = commentHtml; var extInfoObj = detailTemplate.getElementsByClassName('ext-info')[0]; extInfoObj.getElementsByClassName('from')[0].innerText = v.fname; extInfoObj.getElementsByClassName('view-time')[0].innerText = v.views; // 动态绑定click事件并传参 (function(v) { userInfoObj.onclick = function() { loadPage('u', v.authorid); }; titleObj.onclick = commentObj.onclick = function() { loadPage('t', v.tid); }; extInfoObj.onclick = function() { loadPage('f', v.fid); }; })(v); postListObj.appendChild(detailTemplate); }
相关推荐
web前端的朋友们,经常会遇到给由后台返回的数据遍历生成的DOM绑定事件,但是总是绑定不上,那是因为把事件直接绑定到了动态生成的DOM上了,正确的方式是利用事件冒泡给其父元素绑定,这样才能解决问题的哦!
按常理循环绑定事件,但是得到的结果却不是想要的,下面有个不错的示例,可以为大家详细分解下
javascript为DOM绑定事件 兼容 学习笔记
用jquery的时候你会发现,页面渲染后动态生成的dom,在生成之前的代码是没办法取到相应对象的,必须重新获取.但是vue基于数据绑定的特性让它能生成的时候直接绑定数据。 html: <input type=text v-model...
js for循环中实现进度条 & 快速解决js动态改变dom元素属性后页面及时渲染的问题
unigrid添加html5 dom元素.rar
下面小编就为大家带来一篇关于动态生成dom绑定事件失效的原因及解决方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
本文实例讲述了JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法。分享给大家供大家参考,具体如下: 最近项目中遇到了在同一DOM元素上需要添加 onclick 和 ondblclick 2个事件,如果按照正常的方式...
JavaScript之DOM事件(源代码)JavaScript之DOM事件(源代码)JavaScript之DOM事件(源代码)JavaScript之DOM事件(源代码)JavaScript之DOM事件(源代码)JavaScript之DOM事件(源代码)JavaScript之DOM事件(源...
本文实例讲述了JavaScript Dom 绑定事件操作JavaScript Dom 绑定事件操作。分享给大家供大家参考,具体如下: JavaScript Dom 绑定事件 // 先获取Dom对象,然后进行绑定 document.getElementById('xx').onclick ...
DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM事件(ppt)DOM...
主要讲JS初级入门 从不懂到易懂得的过程 其中由for循环 while循环 if else的如何应用知识点 , 字符串的类型 数组创建 对象的概念 DOM对象 以及随机抽人事件 如何获取验证码等简单项目
原生JavaScript,对数据表格进行操作,使用DOM实现数据的动态操作,包括增加、删除、查询、修改。
主要介绍了JS实现动态添加DOM节点和事件的方法,涉及javascript事件响应及针对页面dom元素节点与属性的动态操作相关实现技巧,需要的朋友可以参考下
DOM元素都有一些标准事件,一般使用时只要使用onclick=function的方式就可以了,但是当需要为DOM元素添加多个事件,删除事件,或在用Javascript封装控件的时候,为封装的控件添加自定义事件的时候,onclick=function...
js中DOM事件绑定分析.docx
js事件绑定 JavaScript 有三种事件模型: 内联模型 脚本模型 DOM2 模型 1、内联模型 //基本废除不用 <input type="button" value="按钮" onclick="alert('Lee');" /> <input type="button" ...
js_HTML_Dom操作练习,比较基础的