原型和jQuery和平共存？

Question

我对JavaScript知之甚少,但尽管如此,我还是想在我的wordpress博客上拼凑一些东西.它不起作用,我不知道如何解决它,嘿,这就是StackOverflow的用途,对吧？

首先,错误消息是:

Error: element.dispatchEvent is not a function
Source File: http://.../wp-includes/js/prototype.js?ver=1.6
Line: 3936

它发生在页面加载上.我的页面加载处理程序如此注册:

Event.observe(window, 'load', show_dates_as_local_time);

如果我禁用其他一些插件,错误就会消失,而这(加上谷歌搜索)让我得出结论,这是原型和jQuery(其他一些插件使用)之间的冲突.

其次,我遵循wordpress推荐的使用方法wp_enqeue_script,将JavaScript中的依赖项添加到Prototype库,如下所示:

add_action( 'wp_print_scripts', 'depo_theme_add_javascript' );

function depo_theme_add_javascript() {
    wp_enqueue_script('friendly_dates', 'javascript/friendly_dates.js', array('prototype'));
}

现在我也知道jQuery和Prototype之间存在一些使用jQuery noConflicts方法解决的潜在冲突.我试过从各个地方打电话,但没有好处.我不认为这是问题,因为a)noConflict函数只与$变量有关,这似乎不是问题,而b)我希望 wordpress能为我排序,因为它可以......

最后,使用Venkman调试器我已经确定element错误消息中引用的确实是一个HTMLDocument但也缺少一个dispatchEvent.不确定这是怎么发生的,因为它是一个标准的DOM方法？

Answer 1

许多图书馆都有一个令人讨厌的伎俩,我非常喜欢它,看起来原型就是其中之一.

Mootools这样做,如果我是对的,它涉及在基本类上重载许多原型,猴子修补它们.

同样,当mootools和jQuery存在时,我同样遇到了奇怪的行为,通常是jQuery死亡,因为它调用了一些对象方法,这种方法已经被Mootools以某种方式重载/猴子修补.

另外,神秘的是,从脚本使用列表中取出mootools,导致一切运行得更快,我得出结论是由于较少的对象污染.

现在我错了,但我从我的经验中得出结论,这些库只是不喜欢彼此共存,并且看到mootools代码在我看来如何降低正常事情的速度,我起来了将所有基于mootools的代码移植到jQuery(我向你保证这是一个耗时的交易),结果是代码很快 并且没有无法解释的奇怪错误.

我建议你考虑迁移至少是你的一个选择.

写作时还有一件事:

我倾向于将这种语法与我所有的jQuery驱动代码一起使用,以便在有人以某种方式打破'$'的情况下进行一些安全的封装.

运行时代码 在执行之前等待document.ready:

 jQuery(function($){ 
      code_with_$_here; 
 }); 

jQuery插件

(function($){ 
    code_with_$_here; 
})(jQuery); 

使用这些将使使用您正在编写的任何jQuery的人们更容易使用它而不会出现很多冲突问题.

这基本上会让他们确保他们的代码没有做任何真正神奇的事情.

Answer 2

值得在JQuery网站上阅读关于将JQuery与其他库一起使用的文章.它不仅仅涉及noConflict选项.

Answer 3

我认为你应该搜索好,因为所有jQuery插件都有一个原型版本,所有原型插件都有一个jQuery版本.如果你真的不觉得你的样子,你不能只用一个图书馆,看一看这里的

jQuery.noConflict();

但同样,我认为为每个库加载超过15-20kb毫无意义:)

Answer 4

感谢大家的建议。最后我认为 Kent 的解释是最接近的，基本上相当于“原型已损坏”。（抱歉，如果我错误地总结了您：）

至于jQuery.noConflict选项 - 我已经在问题中提到过这一点。当你运行这个方法时，它会产生影响，而我对此几乎没有控制权。正如我所说，我尝试在几个不同的地方运行它（特别是页面标题以及我的脚本文件），但没有效果。因此，尽管我们都希望如此，“仅使用noConflict”并不是这个问题的答案，至少在没有附加信息的情况下是这样。

此外，jQuery.noConflict 似乎与变量有关$，并且错误点周围的代码根本不处理该变量。当然他们之间可能有间接关系，我还没有查到。

所以基本上我最终使用 jQuery 而不是 Prototype 重写了脚本，这实际上有它自己的问题。不管怎样，我已经在我的博客上发布了整个战争故事，如果你感兴趣的话。