Question

我正在使用原型附带的IPBoard CMS，我使用最新的jQuery。

我已经实现了一个jQuery图库图片查看器： - 它在Chrome和Firefox上运行良好。 - 我在Opera和IE 8上遇到了麻烦。

我在这里创建了一个最小的例子：http://www.warriorlabs.net/index.php?app=ccs&module=pages&section=pages&folder=&id=22

您只需点击图片即可。

在IE 8或Opera中：

当我移除原型时，一切正常。

当我使用jQuery与我的“noConflicted”图库查看器一起保存原型时，jQuery访问器返回的宽度和高度似乎存在错误。因此，加载框不居中，图片本身似乎映射到整个窗口。

有没有人知道为什么会这样？

我们将不胜感激。

Answer 1

我实际上并没有同时使用原型和jQuery，但根据我的理解，你应该在原型脚本之前调用jQuery.noConflict()。

尝试将文档头更改为以下内容：

<head>
    <script src="http://cdn.jquerytools.org/1.2.4/full/jquery.tools.min.js"></script>
    <script type="text/javascript">
        jQuery.noConflict();
    </script>
    <script type="text/javascript" src="http://prototypejs.org/assets/2009/8/31/prototype.js"></script>
    <script type="text/javascript" src="http://www.warriorlabs.net/jScript/facebox/facebox.js"></script>
</head>

修改
同时从jQuery.noConflict()中的第一行删除facebox.js，因为它删除了原型定义的$函数。

SIDE注意：
编写jQuery插件的常用方法是这样的：

(function($){ //Inside this block we know that $ == jQuery //The global $ (i.e. window.$) might be something else //By using this anonymous function we make sure we don't polute the global namespace var v = "function scope";//this is a variable in the scope of the function window.globalV = "global scope";//this is a global variable $.fn.myPlugin = function(){ //my plugin code, usually something like: return this.each(function(){ //do something with each element $(this).show(); }); //returning this.each allows for chaining } })(jQuery);

在Chrome中，我在您的演示页面上收到此错误：
Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function [prototype.js:4598]

Answer 2

如果您在原型核心代码中注释掉以下代码，则可以解决此问题。但如果您需要使用scrollto函数，这可能不是最佳解决方案。

    //Commented out because of the conflict with jQuery.
  //scrollTo: function(element) {
   // element = $(element);
   // var pos = Element.cumulativeOffset(element);
   // window.scrollTo(pos[0], pos[1]);
   // return element;
 // },

Answer 3

我解决了类似的问题（jQuery - IE8中的原型冲突错误）将jquery 1.4.2切换为1.5。

与jQuery + Prototype + Opera / IE冲突

3 个答案: