从 Prototype 转换为 JQUERY答案

【问题标题】：Converting to JQUERY from Prototype从 Prototype 转换为 JQUERY
【发布时间】：2010-12-24 08:07:24
【问题描述】：

我目前有一个 Rails 网站，其中包含一些原型脚本。然而，我的老板希望我转换页面，以便它使用 JQUERY 库。我在 Javascript 编程方面没有太多经验，所以我有点困惑。我基本上下载了一个名为 'jrails' 的插件，它可以帮助从 Prototype 的 'script.aculo.us' 中转移所需的助手，并将它们翻译成 JQUERY 可以理解的东西

这里有两个代码：

原型：

new Form.Element.Observer('new_member_search', 0.5, function(element, value){
    new Ajax.Updater('ProjectMemberNew', '/of/user/search', {
        asynchronous:true,
        evalScripts:true,
        parameters:'username=' + encodeURIComponent(value)
    }); 
});

jquery：

$('#new_member_search').delayedObserver(0.5, function(element, value){
    $.ajax({
        data:'username=' + value,
        success:function(request){
            $('#ProjectMemberNew').html(request);
        },
        type:'post', 
        url:'/of/user/search'
    });
});

原型代码运行良好，但 Jquery 似乎由于某种原因无法运行。顺便说一句，我没有更改视图中的任何内容，只是在页面中包含了“jrails”。知道为什么这不起作用吗？谢谢，

编辑 1：

所以我在 Firebug 中进行了一些测试，我想也许我应该发布原始的 rails 代码：

 <%= drop_receiving_element drop_id,
  :onDrop => "function(drag_element, drop_element, event){
if (confirm(\"#{escape_javascript(_('This will remove User from this Group, are you sure?'))}\"))
{#{remote_function(:update => 'module_content',
:url => {:controller => :projects,
:action => :member_delete,
:id => @project.id},
:with => "'u=' + encodeURIComponent(drag_element.id)"
)};}
}",
  :accept => 'RolesUsersSelection',
  :hoverclass => "#{drop_class}_active"

当我在 firebug 上运行网页时，jquery 版本给了我几个错误：

Prototype is not defined
[Break On This Error] linear: Prototype.K,
effect...2478493 (line 71)
$.effects is undefined
[Break On This Error] $.effects.drop = function(o) {
jquery...4111587 (line 15)
$("#RemoveThisMember").droppable is not a function
[Break On This Error] }, hoverClass:'ProjectRoleDropDelete_active'})
member_edit (line 323)
$("#role_15_user_4").draggable is not a function
[Break On This Error] $("#role_15_user_4").draggable({revert:true})

有些事情告诉我，我不能只转移到 jquery 库而不对 rails 代码进行任何更改..

【问题讨论】：

你在使用.delayedObserver插件吗？
不。只是带有 script.aculo.us 的原型。它可以与延迟观察者插件一起使用吗？
等待不，我正在使用 .delayedObserver 插件。对不起。
您遇到错误了吗？如果是这样，请将其发布在您的问题上。在 Firebug 中尝试一些东西。 $('#new_member_search') 会显示一个空数组，还是有条目？如果有条目，请尝试$('#new_member_search').delayedObserver。它是返回function() 还是什么都不返回？如果它返回 function()，请检查 jQuery 文档以了解它应该如何工作。可能其中一个参数不正确。

标签： jquery ruby-on-rails jquery-plugins prototypejs

【解决方案1】：

您必须先初始化 jquery，然后是 jquery-ui，然后是 jrails。如果它不是按这个顺序延迟观察者或任何其他助手将不会初始化。确实很奇怪。 https://github.com/aaronchi/jrails/issues#issue/6

【讨论】：