function renderList(data){
var str = '';
for(var i = 0; i < data.length; i++){
// 动态添加li
str += '<li onclick="getFile(\''+ data[i].file_id + '\',\'' + data[i].file_name+ '\',\'' + data[i].file_type+'\',this)" class="filelist">' + data[i].file_name + '<a href="#" class="easyui-linkbutton" onclick="downLoad(\''+ data[i].file_id + '\')">下载</a>' + '</li>';
} $(".file_list").append(str);
}

使用‘  ’ 字符串模板包裹第v标签,比如‘<li></li>’,其中如果有onclick,需要将其中的参数使用 ‘’ 包裹起来,‘ ’需要\进行转义,转义后的\'        \'    ,中间再使用 ’  ‘包裹,参数使用+ 连接,最后

onclick="downLoad(\''+ data[i].file_id + '\')" 。效果:


还有其中有style的
var str = '<div class="queries-box" style="float:left"><input id="agency_id" class="easyui-combotree combotree-f combo-f textbox-f" data-options="" style="width: 56%; height: 24px; display: none;" textboxname="agency_id" comboname="agency_id"></div>'
var olr = $('#topnav .fr');
olr.append(str);
 

js JQ动态添加div标签的更多相关文章

  1. js/jq 动态添加的元素不能触发绑定事件解决方案

    <!-- Copyright 2017-10-27, Jachin QQ: 381558301 Email: 381558301@qq.com 请看看你们的版本并对号入座: jquery1.6版 ...

  2. ThinkPHP框架下,给jq动态添加的标签添加点击事件移除标签

    jq移除标签主要就是$("#要移除的id").remove();不再赘述,这里要提醒的是jq中动态添加标签后怎样添加点击事件.一般的jq添加点击事件是用这种方法$("#i ...

  3. js 面向对象 动态添加标签

    有点逻辑 上代码 thml布局 点击查看代码 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  4. 动态添加div及对应的js、css文件

    动态添加div及对应的js.css文件 在近期的项目开发中需要在首页中添加很多面板型的div,直接加载代码显得很繁琐,于是利用js封装一个动态添加div及其对应css文件和js文件的方法供大家参考使用 ...

  5. js获取不到动态添加的标签的值的解决方法

    遇到了js无法获得动态添加的标签的值,百度了一番,最后自己解决了问题,但是原理现在还不怎么明确. $("input[id='txtAttValue']").each(functio ...

  6. JS动态添加的标签无法绑定事件解决方案~~~

    今天用ajax实现动态插入数据时发现监听一直不起作用,一样的代码,非动态的就可以监听实现 这是困扰了我近一个小时的bug,后面才理解到可能是动态插入导致的! 看了看网上的解决方案,似乎都不太通俗,讲的 ...

  7. js动态添加Div

    利用JavaScript动态添加Div的方式有很多,在这次开发中有用到,就搜集了一下比较常用的. 一.在一个Div前添加Div <html> <body> <div id ...

  8. jq动态添加的元素触发绑定事件无效

    <div class='a'> <div class='b'> </div> 其中$('.a')是html页面的元素,$('.b')是jq动态添加的元素.$(&qu ...

  9. JavaScript 动态添加div 绑定点击事件

    1.动态添加div function cDiv(num){ var oDiv=document.createElement("div"); oDiv.className='divs ...

随机推荐

  1. 「从零单排canal 03」 canal源码分析大纲

    在前面两篇中,我们从基本概念理解了canal是一个什么项目,能应用于什么场景,然后通过一个demo体验,有了基本的体感和认识. 从这一篇开始,我们将从源码入手,深入学习canal的实现方式.了解can ...

  2. 浅析Java中Ant的使用

     Ant是一种基于Java的打包工具,Ant脚本采用XML格式编写,默认的文件名为build.xml. Ant中常用的节点元素 Project Project是项目工程的顶级节点,一个build. ...

  3. JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验

    1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...

  4. 语言模型 N-gram 与其平滑方法推导

    N-gram N-gram 作为一个名词表示的是一个给定文本/音频样本中有n项(音素,音节,字母,单词)的一个连续序列. 数学表达 N-gram 模型表示的是当前这个 word \(w_i\) 依赖于 ...

  5. Oracle Solaris 10下gdb安装(附安装包)

    文章目录 1. 背景说明 2. gdb相关包 3. gdb安装 3.1 上传资源 3.2 解压 3.3 安装 3.4 环境变量 4. 位数确认 5. 验证可用性 1. 背景说明 本文承接Oracle ...

  6. Dubbo及注册中心原理

    本文首发于微信公众号[猿灯塔],转载引用请说明出处 今天是猿灯塔“365天原创计划”第4天. 今天呢!灯塔君跟大家讲: 一.Dubbo意义 网站应用的架构变化经历了一个从所有服务分布在一台服务器上(A ...

  7. 附007.Docker全系列大总结

    Docker全系列总结如下,后期不定期更新. 欢迎基于学习.交流目的的转载和分享,禁止任何商业盗用,同时希望能带上原文出处,尊重ITer的成果,也是尊重知识. 若发现任何错误或纰漏,留言反馈或右侧添加 ...

  8. 分享几个很实用的CSS技巧对前端技术很有帮助

    创建剪切动画 对于剪切动画,使用clip-path代替width/height,避免DOM重排导致性能过低. .animate { width: 200px; height: 200px; backg ...

  9. css hack原理及常用hack

    原理:利用不同浏览器对CSS的支持和解析结果不一样编写针对特定浏览器样式.常见的hack有1)属性hack.2)选择器hack.3)IE条件注释 IE条件注释:适用于[IE5, IE9]常见格式如下 ...

  10. 逻辑式编程语言极简实现(使用C#) - 4. 代码实现(完结)

    本文是本系列的完结篇.本系列前面的文章: 逻辑式编程语言极简实现(使用C#) - 1. 逻辑式编程语言介绍 逻辑式编程语言极简实现(使用C#) - 2. 一道逻辑题:谁是凶手 逻辑式编程语言极简实现( ...