小编Geo*_*e S的帖子

如何通过ajax加载页面后显示Twitter/Facebook/Google+按钮?

我有一个rails 3.1应用程序,我希望允许用户通过Twitter,Google +和Facebook(类似按钮的HTML5版本)共享项目.我在项目的显示页面上工作得很好(即 ​​- 只显示一个项目),但我在容器页面上遇到问题,该页面通过Ajax加载列表中的项目.我希望在容器中的每个项目旁边都有单独的共享按钮.

页面第一次加载时,每个项目旁边的共享按钮显示正常.只有当我通过ajax重新加载容器时才会出现问题.Twitter,Google +和Facebook按钮不会显示.以下是我设置的方法:

application.html.haml

-# This is right before the body tag closes
= render 'site/share_js'
Run Code Online (Sandbox Code Playgroud)

_share_js.html.erb(来自每个提供商的代码)

<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=MY_APP_ID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


<%# Twitter %>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

<%# Google+ %>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
Run Code Online (Sandbox Code Playgroud)

_share_buttons.html.erb(要传递的项目的URL)

<div class="share-buttons">

<%# Twitter %>
<a  href="https://twitter.com/share" 
class="twitter-share-button" 
data-lang="en"
data-count="horizontal"
data-text="<%= share_text %>"
data-url="<%= bly_url %>">
Tweet
</a>

<%# …
Run Code Online (Sandbox Code Playgroud)

twitter ajax facebook-like ruby-on-rails-3 google-plus

4
推荐指数
1
解决办法
4264
查看次数