layui.table图片显示不全和404问题
1.图片显示不全
在使用layui.table组件中,加载的图片显示不全,需重新定义CSS如下:
.layui-table-cell{
height: auto!important;
white-space: normal;
}
2.图片显示,路径404
在组件中加载图片,本人使用的是如:
{field: 'image', title: '商品图片', align:'center',width:, templet:'<div><img href="{{ d.image }}"></div>',style:'height:50px;'}
结果:图片在表格中显示,但浏览器会另外加载一张图片

使用模板改正就没有这个问题:
首先定义模板,(因为是laravel框架,所以需要@来避免被解析):
<script type="text/html" id="imgTpl">
<img src="@{{ d.avatar }}">
</script>
再在layui.table中定义:
{field: 'avatar', title: '头像', align:'center',width:150, templet:'#imgTpl'}
问题解决
layui.table图片显示不全和404问题的更多相关文章
- matlab保存图片成eps格式不全,导致latex中图片显示不全的问题
我们经常会遇到这样的问题.用将matlab生成的图保存EPS格式后,用GSVIEW打开后,可以看到图片显示不全.遇到这种情况是,我们可以使用dvipdf——dvips的方法来生成PDF,这样生成的pd ...
- jquery easyui datagrid/table 右边线显示不全
<table id="dg" style="height:400px"></table> 右边线显示不全 解决:在外面套一个panel, ...
- 手机浏览PC版页面出现背景图片显示不全的问题解决方案
手机浏览PC版页面出现背景图片显示不全 给定宽高的值
- Word 固定行间距公式图片显示不全、Word Eculid 字体导致行间距过大、Word 行间距过大
1. 前言 1.有些文章行间距要求是固定值,比如,固定值15磅,但是这样会导致有些公式.图片显示不全.例如下图: 2.Euclid这个字体很容易导致行间距超大. 2. 解决方案 1.把固定值15磅改为 ...
- word公式图片显示不全的问题
最近处理文档遇到比较棘手的问题,就是单行显示的公式和图片都显示不全,高度撑不起来,会被其他行的内容遮挡. 图片估计是对齐方式照成的,公式调了很久也没有办法.最后找了一个临时折衷的办法: 插入表格,然后 ...
- 关于word图片显示不全
问题:在编辑word时,在其中一行插入一张图片,但是显示不全. 原因:给文字行距设置成 [ 固定值 ]的原因. 解决方案:先删除图片,在插入图片的一行右键--> 段落,弹出对话框,找到设置行距的 ...
- layui开关switch显示不全问题
先看效果: 开关显示不全,高度也不对称. 解决: 在所用到的html/jsp中自己加css .layui-form-switch { width: 52px; height: 23px; } 再看效果 ...
- (转)Word插入图片显示不全怎么办
https://jingyan.baidu.com/article/e73e26c0c0081c24adb6a73d.html 现在告诉大家解决办法. 方法一: A.单击选中图片,然后在“开始”选项卡 ...
- android 自定义ratingbar 图片显示不全的解决方案
在res/style中自定义评分条: <!-- 自定义评分条 --> <style name="roomRatingBar" parent="@andr ...
随机推荐
- 【Windows】JDK安装与环境变量配置
一.JDK下载 jdk有多个版本: java se开发包:Java SE Development Kit 8u25 ,必须的配置Java开发环境的.java se开发包+示例:Java SE Deve ...
- ansible安装 使用 介绍
1.介绍安装 a.介绍 Ansible:—基于 Python paramiko 开发,分布式,无需客户端,轻量级,配置语法使用 YMAL 及 Jinja2模板语言,更强的远程命令执行操作. b.安装 ...
- angular2报错
1.运行ng serve的时候卡在95% emitting LicenseWebpackPlugin 放弃使用cnpm,使用yarn 删除node_modules (不需要删除project目录重新n ...
- 蓝桥杯 穿越雷区(bfs)
题目描述 X星的坦克战车很奇怪,它必须交替地穿越正能量辐射区和负能量辐射区才能保持正常运转,否则将报废.某坦克需要从A区到B区去(A,B区本身是安全区,没有正能量或负能量特征),怎样走才能路径最短? ...
- 微信小程序支付遇到的坑
1,微信公众号支付和微信小程序支付有差异 微信公众号:可以直接跳转走h5的微信支付 微信小程序:在测试环境.沙箱环境使用微信公众号的跳转支付没有问题,在线上存在支付异常 最后商讨的解决方法 openi ...
- 2013年省赛H题
2013年省赛H题你不能每次都快速幂算A^x,优化就是预处理,把10^9预处理成10^5和10^4.想法真的是非常巧妙啊N=100000构造两个数组,f1[N],间隔为Af2[1e4]间隔为A^N,中 ...
- redux+saga+reducer
saga.js这个文件里面的函数实际没有在其他jsx中引用吧?这个文件的作用就是把异步数据拿到,放进reducer,如果jsx想取,需要结合connect来取数据.
- VMware workstation pro 15 安装Ubuntu(图文教程)
今天分享一下虚拟机安装Ubuntu的过程,在开始安装之前,需要下载VMware workstation pro和Ubuntu镜像,两者我都用的最新版,由于VMware workstation pro ...
- 2018-2019-2 网络对抗技术 20162329 Exp3 免杀原理与实践
目录 免杀原理与实践 一.基础问题回答 1.杀软是如何检测出恶意代码的? 2.免杀是做什么? 3.免杀的基本方法有哪些? 二.实验内容 1. 正确使用msf编码器 2. msfvenom生成如jar之 ...
- 网络编程-SOCKET开发之----2. TCP粘包现象产生分析
1. 粘包现象及产生原因 1)概念 指TCP协议中,发送方发送的若干个包数据到接收方接收时粘成一包.发送方粘包:发送方把若干个要发送的数据包封装成一个包,一次性发送,减少网络IO延迟:接收方粘包:接收 ...