使用layui 的layedit定義自己的toolbar方法
更新時間：2019年09月18日 10:55:16 作者：天武我非
今天小編就為大家分享一篇使用layui 的layedit定義自己的toolbar方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
官方文檔：http://www.layui.com/demo/layedit.html
官網(wǎng)文檔目前是不支持layedit擴(kuò)展式的。
自己手動實(shí)現(xiàn)擴(kuò)展，定義自己的樣式toolbar：
1.樣式代碼分析
分析頁面初始化后加載的樣式.
layeditIndex=layedit.build('noticeMatterDigest',{tool: ['left', 'center', 'right','|'],height: 120});
2.根據(jù)分析的樣式進(jìn)行js的追加
代碼需要寫在layui.use(..)頁面初始化方法之內(nèi)。
$(".layui-form .layui-form-item.layui-form-text .layui-input-block " +
".layui-layedit .layui-unselect.layui-layedit-tool")
.append('<i class="layui-icon layui-icon-note" title="摘要模板1" οnclick="generateTextArea('+layeditIndex+')"></i>')
.append('<i class="layui-icon layui-icon-template-1" title="摘要模板2" οnclick="generateTextArea('+layeditIndex+')"></i>')
.append('<i class="layui-icon layui-icon-app" title="摘要模板3" οnclick="generateTextArea('+layeditIndex+')"></i>')
.append('<i class="layui-icon layui-icon-template" title="摘要模板4" οnclick="generateTextArea('+layeditIndex+')"></i>')
.append('<i class="layui-icon layui-icon-chat" title="摘要模板5" οnclick="generateTextArea('+layeditIndex+')"></i>');
3.調(diào)用方法向layedit內(nèi)追加值
官方文檔沒有設(shè)置值的方式，但是實(shí)際存在此方法可以調(diào)用
function generateTextArea(index) {
layedit.setContent(index,"<p>姓名:*** *男,*年</p>");
};
最終實(shí)現(xiàn)，擴(kuò)展成自己需要的toolbar的形式，同時與原toolbar兼容。
以上這篇使用layui 的layedit定義自己的toolbar方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript通過function定義對象并給對象添加toString()方法實(shí)例分析
這篇文章主要介紹了JavaScript通過function定義對象并給對象添加toString()方法,實(shí)例分析了javascript中function定義對象及添加方法的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
這篇文章主要給大家介紹了關(guān)于JavaScript如何正確的寫代碼注釋的相關(guān)資料,注釋的作用是提高代碼的可讀性,幫助自己和別人閱讀和理解你所編寫的JavaScript代碼,注釋的內(nèi)容不會在網(wǎng)頁中顯示,需要的朋友可以參考下2023-10-10
深入理解JavaScript中async/await的錯誤處理方式
在現(xiàn)代JavaScript開發(fā)中,異步編程是不可或缺的一部分,async和await是一種強(qiáng)大的異步編程工具,它們使得編寫和維護(hù)異步代碼更加容易和清晰,然而,異步操作仍然可能會出現(xiàn)錯誤,本文將深入探討async和await的錯誤處理方式,提供詳細(xì)的代碼示例和解釋2023-09-09
這篇文章主要介紹了理解JavaScript中的window對象,本文通過實(shí)例代碼詳細(xì)介紹Window對象的一些重要用途，需要的朋友可以參考下2022-07-07
沒必要一開始加載就要把全部圖片加載出來，這樣子打開網(wǎng)面的速度得到了很好提高，下面有個不錯的思路，大家可以看看2014-09-09
這篇文章主要為大家詳細(xì)介紹了js輪播圖無縫滾動效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-06-06
今天小編就為大家分享一篇解決JavaScript layui 下拉框不顯示的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了JavaScript this綁定過程,結(jié)合實(shí)例形式深入分析了JavaScript中this關(guān)鍵字的功能、原理、綁定方式及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2018-12-12
js的壓縮及jquery壓縮探討(提高頁面加載性能/保護(hù)勞動成果)
搞定js的加密和壓縮，一方面可以提高頁面加載性能，另外一方面也希望辛苦研發(fā)出來的成果得到一定的保護(hù),感興趣的朋友可以了解下，或許對你有所幫助2013-01-01
JavaScript獲取表格（table）當(dāng)前行的值、刪除行、增加行
這篇文章主要介紹了JavaScript獲取表格（table）當(dāng)前行的值、刪除行、增加行,本文直接給出代碼示例,需要的朋友可以參考下2015-07-07