Css 我怎样才能让twitter像悬停一样'；遵循'；带引导的按钮？_Css_Ruby On Rails_Twitter Bootstrap

Css 我怎样才能让twitter像悬停一样'；遵循'；带引导的按钮？

css ruby-on-rails twitter-bootstrap

Css 我怎样才能让twitter像悬停一样'；遵循'；带引导的按钮？,css,ruby-on-rails,twitter-bootstrap,Css,Ruby On Rails,Twitter Bootstrap,现在我有了一个按钮，可以跟随用户，也可以取消跟随。现在，当目标用户已经被跟踪时。就像这样展示的然后目标用户没有被跟踪，它显示如下我希望在目标用户已被跟踪时显示为“跟踪”。然后，当我将鼠标光标移到按钮上时，显示应更改为“取消跟随” 我如何使用引导程序实现这一点查看 <% if user_signed_in? %> <% unless user == current_user %> <% if current_user.followin

现在我有了一个按钮，可以跟随用户，也可以取消跟随。
现在，当目标用户已经被跟踪时。就像这样展示的

然后目标用户没有被跟踪，它显示如下

我希望在目标用户已被跟踪时显示为“跟踪”。
然后，当我将鼠标光标移到按钮上时，显示应更改为“取消跟随”

我如何使用引导程序实现这一点

查看

<% if user_signed_in? %>
    <% unless user == current_user %>
      <% if current_user.following?(user) %>
        <%= link_to(unfollow_user_path(user), :remote => true, :class => 'btn') do %>
       <i class="icon-remove"></i>
       Un-Follow
     <% end %>
      <% else %>
        <%= link_to(follow_user_path(user) ,:remote => true, :class => 'btn btn-primary') do %>
        <i class="icon-ok icon-white"></i>
        Follow
        <%end%>
      <% end %>
    <% end %>
<% else %>
        <%= link_to(new_user_session_path , :class => 'btn btn-primary') do %>
        <i class="icon-ok icon-white"></i>
        Follow
        <%end%>
<% end %>


true，：class=>btn'）do%>
不跟随
true，：class=>'btn btn primary'）do%>
跟随
'btn btn primary'）do%>
跟随

HTML

<a href="/user/1/follow" class="btn btn-primary" data-remote="true">
    <i class="icon-ok icon-white"></i>
    Follow
</a>

<a href="/user/1/unfollow" class="btn btn-primary" data-remote="true">
    <i class="icon-remove icon-white"></i>
    Un-Follow
</a>

更新：

<a href="/user/1/unfollow" class="btn" data-remote="true" onhover="someFunction()">
    <i id="Following" class="icon-remove"></i>
    Following
</a>

使用onHover事件，您可以使用jQuery来更改要更改文本的按钮的“class”属性

i、 e


someFunction（）{
$（'i#follow'）.attr（“类”，“图标ok图标白色”）.innerText（“Unfollow”）；
}

希望你能了解情况

编辑：这是鼠标悬停在someFunction中激发代码的完整代码

<html>

<head>
<script type="text/javascript">

function someFunction()
{
 alert("Hello");
}
</script>
</head>

<body>
<a href="/user/1/unfollow" class="btn" data-remote="true" onmouseover="someFunction();return true;" >
    <i  id="Following" class="icon-remove"></i>
    Following
</a>
</body>

</html>


函数someFunction（）
{
警惕（“你好”）；
}

您的Javascript中有多余/缺少的引号。这不是完全适合生产的代码。OP必须编写100%的rite代码，但90%的工作已经完成。嗯，我尝试了这个，但在我的代码上不起作用：（（“someFunction（）”，：remote=>true，：class=>btn'）do%>从中生成的HTML是什么？@user373466我更新了我的问题。请检查底部。

<html>

<head>
<script type="text/javascript">

function someFunction()
{
 alert("Hello");
}
</script>
</head>

<body>
<a href="/user/1/unfollow" class="btn" data-remote="true" onmouseover="someFunction();return true;" >
    <i  id="Following" class="icon-remove"></i>
    Following
</a>
</body>

</html>