jquery追加元素问题

自渡96 2018-01-11 09:49:15
怎么用jquery对下面的div追加内容
<div class="aui-content aui-margin-b-15" id="div">
</div>

追加的内容
<ul class="aui-list aui-media-list">
<li class="aui-list-item">
<div class="aui-media-list-item-inner">
<div class="aui-list-item-inner">
<div class="aui-list-item-text">
<div class="aui-list-item-title">文件名</div>
<div class="aui-list-item-right">创建时间</div>
</div>
<div class="aui-list-item-text">
文件信息
</div>
</div>
</div>
<div class="aui-info">
<div class="aui-info-item">
<span class="aui-margin-l-5">修改人</span>
</div>
<div>
<div class="aui-btn" onclick="fnDownload()" >下载</div>
<div class="aui-btn" onclick="openxls()">打开</div>
<div class="aui-btn" onclick="openqianzi()">签字</div>
<div class="aui-btn" onclick="doUpload()">上传</div>
<div class="aui-btn" onclick="x()">列表</div>
</div>
</div>
</li>
</ul>
...全文
257 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
自渡96 2018-01-12
  • 打赏
  • 举报
回复
引用 1 楼 showbo 的回复:

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
Web开发学习资料推荐 jQuery仿excel表格单元格合并插件 Web开发
<div>\ <input type="hidden" name="field_name" value= ret.records[i].fileUid >\ <div class="aui-btn" onclick="fnDownload()" >下载</div>\ <div class="aui-btn" onclick="openxls()">打开</div>\ <div class="aui-btn" onclick="openqianzi()">签字</div>\ <div class="aui-btn" onclick="doUpload()">上传</div>\ <div class="aui-btn" onclick="x()">列表</div>\ <input type="hidden" name="field_name" value= ret.records[i].fileUid >\ input这么加错有吗?value的值获取到值
Go 旅城通票 2018-01-11
  • 打赏
  • 举报
回复
直接诶字符串连接就行了 <div class="aui-list-item-title">第' + i + '个fileName:' + ret.records[i].fileNam + '</div>\ 其他要替换的自己串接
自渡96 2018-01-11
  • 打赏
  • 举报
回复
引用 1 楼 showbo 的回复:

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
Web开发学习资料推荐 jQuery仿excel表格单元格合并插件 Web开发
引用 1 楼 showbo 的回复:

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
Web开发学习资料推荐 jQuery仿excel表格单元格合并插件 Web开发
引用 1 楼 showbo 的回复:

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
Web开发学习资料推荐 jQuery仿excel表格单元格合并插件 Web开发
引用 1 楼 showbo 的回复:

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
Web开发学习资料推荐 jQuery仿excel表格单元格合并插件 Web开发
[quote=引用 1 楼 showbo 的回复:]

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>
文字(文件名)部分能不能插入jquery获取的值啊,?我插入有问题 我想插入下面的fileName获取到的值 var fileName = "第"+i+"个fileName:"+ret.records[i].fileName; alert(fileName); var createTime = "第"+i+"createTime:"+ret.records[i].createTime; alert(createTime);
Go 旅城通票 2018-01-11
  • 打赏
  • 举报
回复

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<div id="div"></div>
<script type="text/javascript">
    $('#div').append('<ul class="aui-list aui-media-list">\
           <li class="aui-list-item">\
               <div class="aui-media-list-item-inner">\
                   <div class="aui-list-item-inner">\
                       <div class="aui-list-item-text">\
                           <div class="aui-list-item-title">文件名</div>\
                           <div class="aui-list-item-right">创建时间</div>\
                       </div>\
                       <div class="aui-list-item-text">\
                                                                                   文件信息\
                       </div>\
                   </div>\
               </div>\
               <div class="aui-info">\
                   <div class="aui-info-item">\
                       <span class="aui-margin-l-5">修改人</span>\
                       </div>\
                   <div>\
                     <div class="aui-btn" onclick="fnDownload()" >下载</div>\
                     <div class="aui-btn" onclick="openxls()">打开</div>\
                     <div class="aui-btn" onclick="openqianzi()">签字</div>\
                     <div class="aui-btn" onclick="doUpload()">上传</div>\
                     <div class="aui-btn" onclick="x()">列表</div>\
                   </div>\
               </div>\
           </li>\
        </ul>')
    </script>


Web开发学习资料推荐
jQuery仿excel表格单元格合并插件
Web开发
自渡96 2018-01-11
  • 打赏
  • 举报
回复
已解决感谢大佬

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧