jQuery datatable 显示图表信息时,如何将图片url显示为相应地址的图片,无url的不显示?
ajax 文件:
{
"list": [
{
"uid": "3",
"username": "3",
"password": "26629555d5e54c953b60b40f0beee96f",
"user_head": "http://www.zgwhl.com/agent/agent/images/3_head.jpg",
"salt": "171327",
"role": "1",
"name": "周杰伦",
"status_auth": "2",
"status_pause": "0",
"money": "11",
"money_pay": "0",
"loupan": "123",
"company": "我爱我家",
"mdid": "我爱我家杭州电",
"rpid": null,
"sfz": "333333333333333333",
"sfz_zm": "/data/website/agency/uploads/sfz/3_zm.jpg",
"sfz_fm": "/data/website/agency/uploads/sfz/3_fm.jpg",
"time_create": "2016-06-15 20:58:08",
"phone_contact": "",
"count": "22",
"count_cj": "1",
"count_lj": "6"
},
{
"uid": "4",
"username": "4",
"password": "92b176421601ad8cfe58900e70779d05",
"user_head": "http://www.zgwhl.com/agent/agent/images/4_head.jpg",
"salt": "557452",
"role": "5",
"name": "test",
"status_auth": "2",
"status_pause": "0",
"money": "5",
"money_pay": "0",
"loupan": null,
"company": "yeah",
"mdid": "我爱我家",
"rpid": null,
"sfz": "",
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-15 21:42:38",
"phone_contact": "",
"count": "1",
"count_cj": "0",
"count_lj": "1"
},
{
"uid": "6",
"username": "10010",
"password": "c16a5320fa475530d9583c34fd356ef5",
"user_head": "",
"salt": "1",
"role": "5",
"name": "32a",
"status_auth": "0",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "淘房",
"mdid": "HZKL2",
"rpid": null,
"sfz": "9999999999999999",
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:23:46",
"phone_contact": "",
"count": "0",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "7",
"username": "yangdaxia",
"password": "75e38e33c7ac8c725a06544b298620b6",
"user_head": "",
"salt": "499167",
"role": "1",
"name": "杨大侠",
"status_auth": "0",
"status_pause": "0",
"money": "9",
"money_pay": "0",
"loupan": null,
"company": "我爱我家",
"mdid": "HZKL3",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:23:46",
"phone_contact": "",
"count": "1",
"count_cj": "1",
"count_lj": "1"
},
{
"uid": "9",
"username": "15700079592",
"password": "6ae9cc26159303c9880c9c8e37434a25",
"user_head": "",
"salt": "251659",
"role": "1",
"name": "wulala",
"status_auth": "1",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "东方不败",
"mdid": "0110",
"rpid": null,
"sfz": "000000111100000000",
"sfz_zm": "/var/www/agent/agent/uploads/sfz/9_zm.jpg",
"sfz_fm": "/var/www/agent/agent/uploads/sfz/9_fm.jpg",
"time_create": "2016-06-05 22:23:46",
"phone_contact": "",
"count": "0",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "10",
"username": "15869024286",
"password": "1dc1d38995fd63c6293508dea77e42ff",
"user_head": "images/10_head.jpg",
"salt": "729054",
"role": "1",
"name": "anzheng",
"status_auth": "0",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "我爱我家",
"mdid": "123",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:23:46",
"phone_contact": "",
"count": "0",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "11",
"username": "13588073934",
"password": "ad3b93f0cf21a59be45875aa64f81f94",
"user_head": "http://www.zgwhl.com/agent/agent/images/11_head.jpg",
"salt": "881196",
"role": "1",
"name": "zyc",
"status_auth": "2",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "呵呵",
"mdid": "1",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:24:37",
"phone_contact": "",
"count": "1",
"count_cj": "0",
"count_lj": "1"
},
{
"uid": "13",
"username": "13588879099",
"password": "ac5c207c3d999bedc16fe97b00f084c4",
"user_head": "",
"salt": "947519",
"role": "1",
"name": "林启彦",
"status_auth": "0",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "呵呵",
"mdid": "淘房家",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:24:37",
"phone_contact": "",
"count": "0",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "14",
"username": "17742038412",
"password": "723466c40cb3449fd116e573725a7d08",
"user_head": "",
"salt": "714662",
"role": "1",
"name": "陈楠",
"status_auth": "0",
"status_pause": "0",
"money": "6",
"money_pay": "0",
"loupan": null,
"company": "淘房",
"mdid": "再回首",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-05 22:24:37",
"phone_contact": "",
"count": "1",
"count_cj": "0",
"count_lj": "1"
},
{
"uid": "15",
"username": "15381182299",
"password": "5a792cc6373b2ad7d14fd979ce21e0b3",
"user_head": "",
"salt": "465103",
"role": "1",
"name": "钱昊",
"status_auth": "2",
"status_pause": "0",
"money": "9",
"money_pay": "0",
"loupan": null,
"company": "yeah",
"mdid": "888",
"rpid": null,
"sfz": "1",
"sfz_zm": "/var/www/agent/agent/uploads/sfz/15_zm.jpg",
"sfz_fm": null,
"time_create": "2016-06-05 22:24:37",
"phone_contact": "",
"count": "1",
"count_cj": "1",
"count_lj": "1"
},
{
"uid": "18",
"username": "test",
"password": "0128feddc6ea8a60d13d66b0c1fbcbd3",
"user_head": "",
"salt": "867030",
"role": "1",
"name": "wulala",
"status_auth": "2",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "wucompany",
"mdid": null,
"rpid": null,
"sfz": "",
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-15 21:32:46",
"phone_contact": "15700079592",
"count": "0",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "19",
"username": "18957150439",
"password": "fdbeaf82a8476f26ce19a588c32d9a1b",
"user_head": "http://www.zgwhl.com/agent/agent/images/19_head.jpg",
"salt": "395852",
"role": "1",
"name": "刘晓",
"status_auth": "0",
"status_pause": "0",
"money": "7",
"money_pay": "0",
"loupan": null,
"company": "",
"mdid": "我爱我家",
"rpid": null,
"sfz": null,
"sfz_zm": null,
"sfz_fm": null,
"time_create": "2016-06-13 17:50:28",
"phone_contact": null,
"count": "1",
"count_cj": "0",
"count_lj": "0"
},
{
"uid": "20",
"username": "18368118811",
"password": "279b04fb2676fa0cb860fb73a1593bd8",
"user_head": "http://www.zgwhl.com/agent/agent/images/20_head.jpg",
"salt": "558484",
"role": "1",
"name": "刘晓",
"status_auth": "1",
"status_pause": "0",
"money": "0",
"money_pay": "0",
"loupan": null,
"company": "",
"mdid": "我爱我家",
"rpid": null,
"sfz": "450202198208110668",
"sfz_zm": "http://www.zgwhl.com/agent/agent/images/20_zm.jpg",
"sfz_fm": "http://www.zgwhl.com/agent/agent/images/20_fm.jpg",
"time_create": "2016-06-15 19:16:57",
"phone_contact": null,
"count": "5",
"count_cj": "0",
"count_lj": "1"
}
]
}
js 代码如下:
$(document).ready(function(){
$("#example").DataTable({
data: "objects.txt",
columns: [
{
"data": "uid"
},
{
"data": "username"
},
{
"data": "password"
},{
"data": "user_head"
},
{
"data": "salt"
},
{
"data": "role"
},
{
"data": "name"
},
{
"data": "status_auth"
},
{
"data": "status_pause"
},
{
"data": "money"
},
{
"data": "money_pay"
},
{
"data": "loupan"
},
{
"data": "company"
},
{
"data": "mdid"
},{
"data": "rpid"
},{
"data": "sfz"
},
{
"data": "sfz_zm"
},{
"data": "sfz_fm"
},{
"data": "time_create"
},{
"data": "phone_contact"
},{
"data": "count"
},{
"data": "count_cj"
},{
"data": "count_lj"
}
]
});
});
html如下:
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>uid</th>
<th>username</th>
<th>password</th>
<th>user_head</th>
<th>salt</th>
<th>role</th>
<th>name</th>
<th>status_auth</th>
<th>status_pause</th>
<th>money</th>
<th>money_pay</th>
<th>loupan</th>
<th>company</th>
<th>mdid</th>
<th>rpid</th>
<th>sfz</th>
<th>sfz_zm</th>
<th>sfz_fm</th>
<th>time_create</th>
<th>phone_contact</th>
<th>count</th>
<th>count_cj</th>
<th>count_li</th>
</tr>
</thead>
<tbody></tbody>
<tfoot>
</tfoot>
</table>
我现在需要将第四个属性user_head 转换为相应的图片,没有url的不显示就行。我的想法是对user_head这一属性进行判断,不空的进行操作,具体怎么实现,想不到。
需要怎么做,求帮助!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
官方api或者demo是有定义的 你再去看看吧
我记得 在columnDefs函数中可以修改返回的值, 'target'指的是columns里的值得位置,'render'调用自己定会议的函数来重置返回值并返回。
下面是我之前许久的一段代码
这样你应该可以操作你的数据了
写一个js判断 有值 就把值拼成<img src='url'> 没值 就返回空
周末两天休息,没上来看。周五的时候问题已经解决,在查看官网的时候找到了解决方案,就是用render 来定义返回值的。一楼是正解!