基金會5顯示不使用JQuery 3.1.1

使用Chrome 50 & JQuery 3.1.1我試圖讓基本的基礎揭示模式工作。我從Zurb網站上的基本示例中複製了代碼，並將其放在我的頁面的主體標記中。基金會5顯示不使用JQuery 3.1.1

<a href="#" data-reveal-id="myModal" id="test">++</a> 
<div id="myModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog"> 
    <h2 id="modalTitle">Security Details</h2> 
    <p>My message</p> 
    <a class="close-reveal-modal" aria-label="Close">&#215;</a> 
</div>

而且我已驗證所有庫正在加載。我的網頁上的最後一塊腳本是

<script> 
    $(document).foundation(); 
</script>

，我知道是工作，因爲我使用的工作，其他的基金會元素。

當我點擊鏈接「++」我得到一個錯誤在我的控制檯

Uncaught TypeError: Cannot read property 'defaultView' of null

如果我再在控制檯運行

$('#myModal').foundation('reveal', 'open');

揭密對話框顯示出來，從此直到我重新加載頁面「++」鏈接也工作。所以我猜在設置點擊事件鏈接不工作的地方，但JQuery的錯誤信息是沒有意義的。

任何想法？（我也使用jQuery遷移庫）

來源

2017-04-06 John S

是否使用基金會5.5.3？ – tymothytym

看起來像5.4.0 –

我覺得你的問題是在jQuery的3（https://jquery.com/upgrade-guide/3.0/#breaking-change-load-unload-and-error-removed）推出了重大的變動，特別是去除.load，因爲你正在使用的遷移，你可能意識到在一定程度上圖書館，所以我不會喋喋不休。

移植似乎並不總是適用於舊版Foundation（請參閱此處的問題：https://github.com/zurb/foundation-sites/issues/8975），但爲什麼這對於幾種不同的意見而言更加模糊。

好消息是你有兩個修復選項。

修復選項一個

的Zurb建議的修復方法是手動補丁中所有的破引用.load。我無法找到F5的列表，但這裏是F6的列表，我猜他們很相似（公共>>https://github.com/zurb/foundation-sites/pull/8923/commits/c0b42643da96d3b297f3d7c35ccdcebed92ad7a1）。這並不是說很多文件，受影響的有：

DIST/foundation.js
DIST /插件/ foundation.interchange.js
DIST /插件/ foundation.util.triggers.js
js/foundation.interchange.js
js/foundation.util.triggers。js

他們都是同一個問題;使用折舊.load(fn)

如果你感到非常大膽，你可以只全局替換的所有實例：

.load(function() {

與

.on("load", function() {

修復選項2

我們e jQuery Migrate的1.4.1版本。我不完全確定爲什麼1.4.1在更高版本不支持的情況下工作（或者爲什麼他們完全跳過版本2），但它確實起作用，所以這可能是一個足夠好的開始。（3.0.0 & 3.0.1-rc都會產生錯誤，這在嘗試讓jQuery 3正常工作時似乎有點違反直覺）。

以F 5.5.3工作，JQ 3.1.1 & JQM 1.4.1 >>https://jsfiddle.net/tymothytym/fxbk6h1d/

來源

2017-04-11 18:33:33 tymothytym

選項2應該是正確的答案。謝謝！ – facundofarias

基金會5顯示不使用JQuery 3.1.1

回答

相關問題