1

我无法掌握如何处理伏特的前端事件,希望这个具体问题可以帮助启发我。

我实现了网络广播中的简单聊天程序,并希望在它的基础上进行构建。具体来说,我希望聊天窗口在填充聊天窗口时保持滚动到底部。我认为关键是 jquery .animate({ scrollTop:...}) 方法,但我不明白如何在伏特中实现它。有人可以启发我吗?

我的第一次尝试是控制器中的“scroll_bottom”方法 https://github.com/mmattthomas/chat/blob/master/app/main/controllers/main_controller.rb#L30-L36

def scroll_bottom
  `
   var newscrollHeight = $('.panel-body').attr('scrollHeight') - 20;
   //alert('newscrollHeight:' + newscrollHeight);
   $('.panel-body').animate({ scrollTop: newscrollHeight }, 'normal');
  `
end

javascript 运行,但变量返回 NaN。

视图在这里: https ://github.com/mmattthomas/chat/blob/master/app/main/views/main/index.html

即使这个特定的例子也不能解决整个问题(如果其他人添加到聊天中,什么事件可以将聊天窗口动画到底部?) - 那么如何最好地使用 volt 实现这个客户端操作?

4

1 回答 1

0

嗯,关于 Volt 的一件好事是它使用OpalRb进行客户端工作。要在 Volt 中运行 jQuery 之类的东西,我认为使用Opal 包装器是最简单的,它允许使用 Ruby 访问 jQuery 之类的库。

使用opal-jquery包装器,我将实现一个 jQuery 动画,如下所示:

panel_body = Element.find(".panel-body")
panel_body.animate({ scrollTop: panel_body.children.height }, speed: "normal")

编辑:

这是您项目的一个分支,我已经针对此问题实施了修复,您可以查看。

于 2015-08-04T13:57:24.130 回答