layui表格內(nèi)放置圖片,并點擊放大的實例
更新時間：2019年09月10日 11:15:28 作者：楊蔥兒
今天小編就為大家分享一篇layui表格內(nèi)放置圖片,并點擊放大的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
我就廢話不多說了，直接上代碼吧！
cols: [[ //表頭
{
field: 'brand_img_url',
title: '圖片',
sort: true,
templet: function(d){
return '<div οnclick="show_img(this)" ><img src="'+d.brand_img_url+'" alt="" width="50px" height="50px"></a></div>';
}
}
]]
//顯示大圖片
function show_img(t) {
var t = $(t).find("img");
//頁面層
layer.open({
type: 1,
skin: 'layui-layer-rim', //加上邊框
area: ['80%', '80%'], //寬高
shadeClose: true, //開啟遮罩關(guān)閉
end: function (index, layero) {
return false;
},
content: '<div style="text-align:center"><img src="' + $(t).attr('src') + '" /></div>'
});
}
以上這篇layui表格內(nèi)放置圖片,并點擊放大的實例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
BootStrap Datetimepicker 漢化的實現(xiàn)代碼
這篇文章主要介紹了 BootStrap Datetimepicker 漢化的實現(xiàn)代碼,需要的朋友可以參考下2017-02-02
純JavaScript實現(xiàn)的兼容各瀏覽器的添加和移除事件封裝
這篇文章主要介紹了純JavaScript實現(xiàn)的兼容各瀏覽器的添加和移除事件封裝,本文直接給出實現(xiàn)代碼,代碼中帶詳細注釋,需要的朋友可以參考下2015-03-03
這篇文章主要介紹了微信小程序圖片放大預(yù)覽功能的實現(xiàn)方法,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-11-11
這篇文章主要介紹了js實現(xiàn)簡單驗證碼的方法，驗證碼主要是為了網(wǎng)站的安全性，防止惡意注冊和登陸，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2015-12-12
這篇文章主要介紹了使用命令對象代替switch語句的寫法示例,JS規(guī)范里面是禁止使用switch語句的,使用命令對象可以完美的解決這個問題,需要的朋友可以參考下2015-02-02
JavaScript計算值然后把值嵌入到html中的實現(xiàn)方法
下面小編就為大家?guī)硪黄狫avaScript計算值然后把值嵌入到html中的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
webpack.DefinePlugin與cross-env區(qū)別詳解
這篇文章主要介紹了webpack.DefinePlugin與cross-env區(qū)別詳解，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
我們存在著大量在PC頁面通過表格看數(shù)據(jù)業(yè)務(wù)場景，表格又分為兩種，一種是antd?/?fusion這種基于dom元素的表格，另一種是通過?canvas?繪制的類似?excel?的表格，這篇文章主要介紹了antd/fusion表格增加圈選復(fù)制功能,需要的朋友可以參考下2023-09-09
這篇文章主要為大家詳細介紹了js canvas實現(xiàn)俄羅斯方塊，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-10-10
JavaScript實現(xiàn)元素滾動條到達一定位置循環(huán)追加內(nèi)容
下面小編就為大家分享一篇JavaScript實現(xiàn)元素滾動條到達一定位置循環(huán)追加內(nèi)容，具有很好的參考價值，希望對大家有所幫助2017-12-12