Question

我尝试使用jQuery（2.x.x）和prototype.js（1.7.2），结合基础站点6（尝试过6.1.2,6.2.0-rc.1）。从那时起基础5的工作导致了奇怪的结果。与下拉列表的第一次交互正在按预期工作，但进一步的交互会无限地增加下拉窗格的偏移量。

除了jQuery和prototype.js之外，我还导入了这些基础组件：

foundation.core.js
foundation.util.keyboard.js
foundation.util.triggers.js
foundation.util.mediaQuery.js
foundation.util.box.js
foundation.dropdown.js

示例：https://jsfiddle.net/4pqzmr7k/1/

这是callstack，它显示了prototype.js

内部的道路

$ (prototype.js:2048)
show (prototype.js:2168)
_methodized (prototype.js:456)
jQuery.extend.trigger (jquery.js:7825) ==> elem[type]();
(anonymous function) (jquery.js:7875)
jQuery.extend.each (jquery.js:360)
jQuery.fn.jQuery.each (jquery.js:137)
jQuery.fn.extend.trigger (jquery.js:7874)
Dropdown.open (foundation.dropdown.js:333)
(anonymous function) (foundation.dropdown.js:217)

我不完全确定这是否是基础中的错误，或者我是否只是做错了。但是有了Foundation＆lt;一切都很好。如果我删除prototype.js一切正常，但我无法做到这一点，因为它是我们项目中的依赖项。

Answer 1

添加js：

<script>
/* jQuery no conflict */
jQuery.noConflict();

/* Workaround Foundation / Prototype conflicts */
if (Prototype.BrowserFeatures.ElementExtensions) {
    var disablePlugins = ['dropdown', 'tooltip', 'drilldown', 'dropdownmenu'];
    var preventPrototypeJS = function (method, disablePlugins) {
        var handler = function (event) {
            event.target[method] = undefined;
            setTimeout(function () {
                delete event.target[method];
            }, 0);
            console.log(method + ' - ' + disablePlugins);
        };
        disablePlugins.each(function (plugin) {
            jQuery(window).on(method + '.zf.' + plugin, handler);
        });
    };
    preventPrototypeJS('show', disablePlugins);
    preventPrototypeJS('hide', disablePlugins);
}
/* */
jQuery(function ($) {
    /* Foundation sites */
    $(document).foundation();
});
</script>

Foundation，jQuery和Prototype.JS：Dropdown＆amp; DropdownMenu没有按预期工作

1 个答案: