87,901
社区成员
发帖
与我相关
我的任务
分享
<ul class="thumbnails"></ul>
<ul class="thumbnails">
<li class="span3">
<div class="thumbnail">
<img data-src="holder.js/300x200" alt="300x200"
style="width: 300px; height: 200px;"
src="">
<div class="caption">
<ul class="project-one">
<li class="project-title"><a href="${ctx }/project/detail?id=" title="">
这里是用来写项目的简介的。。。。 </a></li>
<li class="project-function"><a
href="#"><i class="address"></i>成都</a> <a class="persent" href="#"> 58% </a></li>
<li class="project-stats">
<div class="project-jindu">
<div class="projectpledged" style="width: 30%;"></div>
</div>
<div class="projectstats">
<p class="widtha">
<strong> 122 </strong> 关注
</p>
<p class="widthb">
<strong><b>¥</b> 1028 </strong> 筹资
</p>
<p class="widthc">
<strong> 36<b>天</b>
</strong> 剩余时间
</p>
</div>
</li>
</ul>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail">
<img data-src="holder.js/300x200" alt="300x200"
style="width: 300px; height: 200px;"
src="">
<div class="caption">
<ul class="project-one">
<li class="project-title"><a href="${ctx }/project/detail?id=" title="">
这里是用来写项目的简介的。。。。 </a></li>
<li class="project-function"><a
href="#"><i class="address"></i>成都</a> <a class="persent" href="#"> 58% </a></li>
<li class="project-stats">
<div class="project-jindu">
<div class="projectpledged" style="width: 30%;"></div>
</div>
<div class="projectstats">
<p class="widtha">
<strong> 122 </strong> 关注
</p>
<p class="widthb">
<strong><b>¥</b> 1028 </strong> 筹资
</p>
<p class="widthc">
<strong> 36<b>天</b>
</strong> 剩余时间
</p>
</div>
</li>
</ul>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail">
<img data-src="holder.js/300x200" alt="300x200"
style="width: 300px; height: 200px;"
src="">
<div class="caption">
<ul class="project-one">
<li class="project-title"><a href="${ctx }/project/detail?id=" title="">
这里是用来写项目的简介的。。。。 </a></li>
<li class="project-function"><a
href="#"><i class="address"></i>成都</a> <a class="persent" href="#"> 58% </a></li>
<li class="project-stats">
<div class="project-jindu">
<div class="projectpledged" style="width: 30%;"></div>
</div>
<div class="projectstats">
<p class="widtha">
<strong> 122 </strong> 关注
</p>
<p class="widthb">
<strong><b>¥</b> 1028 </strong> 筹资
</p>
<p class="widthc">
<strong> 36<b>天</b>
</strong> 剩余时间
</p>
</div>
</li>
</ul>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail">
<img data-src="holder.js/300x200" alt="300x200"
style="width: 300px; height: 200px;"
src="">
<div class="caption">
<ul class="project-one">
<li class="project-title"><a href="${ctx }/project/detail?id=" title="">
这里是用来写项目的简介的。。。。 </a></li>
<li class="project-function"><a
href="#"><i class="address"></i>成都</a> <a class="persent" href="#"> 58% </a></li>
<li class="project-stats">
<div class="project-jindu">
<div class="projectpledged" style="width: 30%;"></div>
</div>
<div class="projectstats">
<p class="widtha">
<strong> 122 </strong> 关注
</p>
<p class="widthb">
<strong><b>¥</b> 1028 </strong> 筹资
</p>
<p class="widthc">
<strong> 36<b>天</b>
</strong> 剩余时间
</p>
</div>
</li>
</ul>
</div>
</div>
</li>
</ul>
var html = "<li class='span3'><div class='thumbnail'><img data-src='holder.js/300x200' alt='300x200' style='width:300px;height:200px;' src=''><div class='caption'><ul class='project-one'><li class='project-title'><a href='${ctx}/project/detail?id=' title=''>这里是用来写项目的简介的。。。。</a></li><li class='project-function'><a href='#'><i class='address'></i>成都</a><a class='persent'href='#'>58%</a></li><li class='project-stats'><div class='project-jindu'><div class='projectpledged' style='width:30%;'></div></div><div class='projectstats'><p class='widtha'><strong>122</strong>关注</p><p class='widthb'><strong><b>¥</b>1028</strong>筹资</p><p class='widthc'><strong>36<b>天</b></strong>剩余时间</p></div></li></ul></div></div></li>";
$(html).appendTo("ul.thumbnails");
如果有多个,可以写成:
$(html).appendTo("ul.thumbnails:eq(" + idx + ")");
另一种,动态生成,参数灵活设置。举个例子。
从内容上看,有以下标签:<div><li><ul><a><img><p>,一些<i><strong>标签可以转为相应的style
比如下面获取ul标签
function GetTagUL(attr, style, html) {
var tagUL = $("<ul></ul>");
if (attr !== undefined && $.trim(attr) !== "") {
$(tagUL).attr(attr);
}
if (style !== undefined && $.trim(style) !== "") {
$(tagUL).css(style);
}
if (html !== undefined && $.trim(html) !== "") {
$(tagUL).html(html);
}
return tagUL;
}
外部使用:
var ul = GetTagUL({ id: 'ul' }, { "text-align": "center" }, "content");
$(ul).appendTo("ul.thumbnails");
var txt1 = '';//这里放我上面一堆html代码
$('.more').before(txt1);
要报错. var txt1 = ''里面的内容好像不能换行.