<!--点击触发弹窗,弹窗显示表格内容-->
<a onclick="ODxp(<?=$v['id']?>,<?=$v['logis_price']?>)">查看详情</a>
<!-- 弹出层 -->
html:
```
<div class="ODxp" style="display: none; padding:10px; width: 520px">
<table class="table table-bordered table-striped" >
<tr>
<th>序号</th>
<th>商品名</th>
<th>商品规格</th>
<th>数量</th>
<!-- <th>包装数量</th> -->
<th>供货单价</th>
</tr>
<tbody id='ab'>
//记录id,通过id进行赋值操作
</tbody>
</table>
<div style="text-align: right;">运费:<i id="yunfei"></i></div>
<div style="text-align: right;">总价:<i id='zongjia'></i></div>
</div>
js:
function ODxp(param1,param2){
//
var id = param1;
var logis_price = param2;
var url = "<?php echo site_url('ware_center/order_list_gooods_details');?>"
$.ajax({
//提交参数到后端获取数据
url:url,
type:'post',
dataType:'json',
data:{'id':id,'logis_price':logis_price},
success:function(resData){
console.log(resData)
var html = '';
$.each(resData.data.data,function(k,v){
html +='<tr>';
//循环返回的数据,插入到表格中
html +='<td>'+k+'</td>';
html +='<td>'+v.sku_name+'</td>';
html +='<td>'+v.sku_attrstr+'</td>';
html +='<td>'+v.num+'</td>';
html +='<td>'+v.sku_sum_price+'</td>';
html +='</tr>';
});
$('#ab').html(html);
$('#yunfei').html(resData.data.freight);
//表格后插入其他数据
$('#zongjia').html(resData.data.order_sum_price);
}
})
layer.open({
//触发展示的弹窗
type: 1,
title: false,
closeBtn: 0,
shadeClose: true,
skin: 'yourclass',
area: ['520px', '300px'],
content: $(".ODxp")
});
}
```