在bootstrap模態框裡面使用ueditor

2021-07-04 08:00:22 字數 764 閱讀 6137

這篇文章主要講如何在bootstrap的模態框裡面使用ueditor。

基本的一些配置就不說了。先說一下要注意的問題:首先是zindex的設定。記住最好都顯示設定模態框和ueditor的zindex。理清他們的層疊關係。

特別是用到ueditor裡面的上傳功能的更要設好zindex的值。具體要怎麼設就不說了,有問題再討論。

然後是模態框裡的全屏問題:通常請款下模態框都比較小,讓使用者在模態框裡的編輯器寫東西,使用者體驗肯定不好。所以要將ueditor全屏。要使ueditor能在bootstrap模態框裡正常全屏顯示需要修改ueditor.all.js裡面的setfullscreen函式

在 while (container.tagname != "body") 裡面加上這段**://解決在modal上ueditor不能全屏的問題

var ismodal =

false;

//判斷該dom是否為modal

var classes = $(container).attr('class'

);if (classes !==

undefined)

}}//如果是modal,則不設定position為static

if (!ismodal)

具體見ueditor論壇裡的這個帖子:

其實就是判斷ueditor的父container是不是bootstrap模態框。如果是,則別將container.style.position設為static。否則全屏的ueditor會被其他元素覆蓋掉。

Bootstrap模態框Modal外掛程式

前提是要引入bootstrap.min.js modal 是覆蓋在父窗體上的子窗體。通常,目的是顯示來自乙個單獨的源的內容,可以在不離開父窗體的情況下有一些互動。子窗體可提供資訊 互動等。1.先定義乙個按鈕 data toggle 以什麼事件觸發,如modal,popover,tooltips等 d...

Bootstrap模態框簡單使用

專案中遇到,記錄一下。引入bootstrap的js和css就可以,官網有就不寫了 html modal fade id my modal tabindex 1 role dialog aria labelledby mymodallabel1 aria hidden true modal dialo...

Bootstrap模態框使用詳解

一.模態框的正常點選出現,如新增功能 新增 二.還有一種就是編輯,此時在彈出模態框時,裡面要寫入資料,所以要先取得資料再彈出模態框。這時要加入js 控制 1.jsp頁面 修改2.js 修改使用者 將使用者資訊寫入模態框 function updatesystemuser else dialog.mo...