jQuery nyroModal 外掛程式遇到問題

2022-02-26 04:35:25 字數 1766 閱讀 4492

nyromodal

ver 1.6.2 彈出層外掛程式 瀏覽更多

初始化大小問題

//

頁面載入完成後初始化 設定大小

$(function

() )

});

多 nyromodal 彈出層自定義大小

前面解決了預設大小設定問題,但針對所有彈出層此設定都是有效的,當乙個頁面有多個彈出層,而且彼此大小不一致時,該如何解決?

在標籤的 nyromodal 事件響應之後,再調整生成的 html 樣式,原因:

在標籤上繫結乙個事件,nyromodal 外掛程式初始化時會合併事件,並且使用者繫結的事件會先執行, 如 nyromodal" href="#content" click="before()">link,

會先執行 before 再彈出層,因此可以先設定內容,再彈出層(此方式也可解決 nyromodal **事件中有 ajax 請求時,彈出了錯誤層,但 ajax 沒返回結果問題,先 ajax 獲取內容,再彈出層)

//

before 方法,先 load 內容,再執行以下**,為什麼 settimeout 呢?

//如果不這樣,就會立即執行,而 nyromodal 層卻沒有生成,因此 settimeout 真是天賜良方

settimeout(function

(), 100);

關閉層**方法,如重新整理頁面;但一旦設定就針對整個頁面,所以研究了根據不同情景,選擇不同響應的實現

乙個頁面中有多種 nyromodal 層,有 div 和 iframe 兩種; div 關閉時不需重新整理頁面,iframe 關閉時要重新整理頁面; 如果 endremove **重新整理,那麼無論 div 還是 iframe 都會重新整理;

因此需要動態判斷,通過**引數選擇響應方式,如下**:

此處通過 class 值進行判斷

$('.nyromodal').nyromodal( 

catch

(e) {}

window.location.href =window.location.href;

}});

js 動態新增的標籤繫結 nyromodal 事件

大家都很熟悉,一般這些外掛程式的初始化,比如 datepicker (下文會講到),都是通過乙個 css 選擇器,然後在 document.ready 中繫結事件。但對於那些通過 js 動態操作 dom 加入的標籤,該如何繫結這些事件呢?相信大家都有遇到過。以 table 中新增一行為例,其中 tr 中有如下 html :

<

a class

="nyromodal"

href

="#content"

>link

<

div

id="content"

>content

div>

其實,實現方式也很簡單,獲得插入的 tr 行 dom 物件,然後執行下面**即可:

1 $(".nyromodal", tr).nyromodal();

總結

關於 nyromodal 外掛程式遇到的問題就記錄到此,後續有問題再做更新。

解決這些問題,關鍵是要認真讀取官方的 document 和 examples,但一般使用者會忽略這些,而是依賴搜尋引擎得到很多不全面的答案。

electron vue build遇到的問題

受限於牆以及網路環境,很多人在嘗試打包electron程式時都會碰到各種問題,下面以electron vue模板為例 打包使用electron builder windows環境下,一步步解決打包時所遇到的錯誤。下面三個檔案操作同步驟2 3.wincodesign 1.9.0.7z 4.nsis 3...

jQuery lazyload外掛程式詳解和問題解答

lazyload外掛程式用於延遲載入,節省伺服器頻寬,減少伺服器請求次數,提高 的頁面載入速度,用於 效能優化,只有當在視窗可視範圍內時才向伺服器請求 引數 如上圖,如果每個列表塊包含兩張,failure limit為0時,當頁面滾動到陰影位置時,只會載入第一張,因為大圖下的頭像沒有載入,所以會停止...

使用NodeJS GruntCLI遇到的問題

執行環境cmd nodejs版本v0.8.4 node version 需求 需要用到grunt的js編譯功能,各位別笑我。使用 安裝完grunt cli報錯 grunt grunt cli the grunt command line inte ce.v0.1.13 fatal error una...