0

语境：

我有两个模型，模型 1 和模型 2。Model1 has_many model2's。在model1 的管理页面中，我呈现了一个_model2.html.erb 文件列表，每个model2 对应一个与model1 关联的文件。为了让用户从 model1 管理页面创建一个新的 model2，我在 model2 的视图目录下创建了一个 create.js.erb 文件。该文件当前如下所示：

$('#back').hide();
$('#allTab').removeClass('active');
$('#activeTab').addClass('active');
$('#completeTab').removeClass('active');
$('html,body').animate({
    scrollTop: $('html,body').scrollHeight
}, {
    duration: 600,
    queue: false
});
$('#activeTabList').closest('.number_of_model2s').text("<%= @model1.model2s.count %>");
$('#activeTabList').append("<li><%= escape_javascript(render partial: 'model2s/model2', locals: {f: @model2, g: @model1}) %></li>");
$('#activeTabList').last().children().effect('highlight', {}, 3000);

问题：

我必须为@model1以使部分工作的渲染。但我无法获得任何动画或突出显示。这个列表可能会很长，这就是我想滚动到页面底部的原因。我希望用户看到添加到列表中。突出显示不是很重要，但我正试图让它工作，因为我也有一个更新操作以类似的方式工作，我想突出显示被更新的部分（我删除了部分在那里，然后我在同一个地方再次请求相同的模型 2 的部分）。

问题：

为什么似乎执行的唯一代码行是渲染部分行是否有特殊原因？

更多信息：

如果我将上面的部分渲染线替换为

$('#activeTabList').append("<li id='model2_<%= @model2.id %>'><%= escape_javascript(render partial: 'model2s/model2', locals: {f: @model2, g: @model1}) %></li>");

在管理页面 html 中，我以这种方式指定列表项的 id，但是如果我在此处添加 id，则部分不会呈现。这似乎与我遇到的问题有关吗？

4

2 回答 2

0

我终于让它滚动了。@gg_s，您的回答有助于我的动画滚动方法的语法，然后我必须修复它以与 mozilla 一起使用。这对我有用：

var $new_campaign_li = $('#activeTabList').children('li').last();
$(jQuery.browser.webkit ? 'body': 'html').animate({
    scrollTop: $new_model2_li.offset().top + $new_model2_li.children().height() / 2 - $(window).height() / 2
}, {
    duration: 600,
    queue: true
});// This delay doesn't seem to work: .delay(1000);
$new_model2_li.children().effect('highlight', {color: '#71EC5E'}, 1500);

高光效果被修复了一个愚蠢的遍历错误。但我确实注意到，queue设置为trueor false，即使我使用delay(1000)，这两个动画也会同时运行。它以我想要的方式工作！谢谢！

于 2013-04-10T06:52:16.673 回答
0

这可能无法挽救局面，但该动画有一些错误。用这个：

$('body').animate({
    scrollTop: $('body')[0].scrollHeight
}, {
    duration: 600,
    queue: false
});
于 2013-04-10T06:46:43.700 回答