rails中的tipTip问题

时间:2011-03-10 20:23:48

标签: jquery ruby-on-rails jquery-plugins

首先,我将告诉我的任务:

我的布局:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

  <title><%= configatron.site_name %></title>

  <%= stylesheet_link_merged :base %>
  <%= stylesheet_link_tag("tipTip") %>
  <%= javascript_include_merged :base %>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  <%= stylesheet_link_tag 'mobile' if mobile_device? %>
  <%= javascript_include_tag('jquery.simplemodal') %>
  <%= javascript_include_tag("jquery.form") %>
  <%= javascript_include_tag("jquery.tipTip") %>
  <%= javascript_include_tag("jquery.tipTip.minified") %>

  <script type="text/javascript">
      $j = jQuery.noConflict();  
  </script>

</head>
<body>
<div id="header">
<!-- my header code -->
</div>
<div id="main">
<%= render :partial => "groups/invite_friends" %>

<%= link_to_function "GANA DINERO CON FISHLE", "basicModal('#invite-friends')" %>
</div>
</body>
</html>

我有下一个部分:

<script type="text/javascript">
    /*TIP TIP*/
    $j(function() {
        $j(".quest-import").tipTip({edgeOffset: 5, delay: 100, defaultPosition: "top"});
    });

    $j(function() {
        $j(".quest-social-network").tipTip({edgeOffset: 5, delay: 100, defaultPosition: "top"});
    });
</script>

<div class="popup" id="invite-friends">
  <% remote_form_for :recommendation, :url => {:controller => "groups", :action => "invite_friend"} do |f| %>
      <div class="header">Invita Amigos</div>
      <div class="content">
        <p>Mensaje de invitación</p>
        <!--#comentario-->
        <div class="fleft">
          <%= image_tag "fishle-logo-medium.png", :width => 115 -%>
          <%= text_area_tag "message", nil, :cols => 20, :rows => 4 -%>
          <%= image_tag "arrow.png", :width => 60, :style => "margin-bottom: 20px;" -%>
        </div>
        <div class="text-box">Invita a tus amigos y conocidos o simplemente haz conocer nuestras espectaculares
          promociones por el medio que más te guste.
        </div>
      </div>

      <div class="section-small  clearfix">
        <div id="voice">
          <p>Díselo a tus amigos
            <%= image_tag "question-mark.png", :class => "quest-social-network", :title => "Corre la voz via facebook, twitter o ambos para formar rapidamente un grupo y aprovechar las ofertas de Fishle" %>
            :
          </p>
        </div>
        <div class="small-image-for-invites fleft">
          <div id="fb" class="fleft">
            <a href="http://www.facebook.com/share.php?u=<%= h "http://#{configatron.site_url}/signup/#{current_user.id}" %>">
              <%= image_tag "fb-icon.png", :style => "float: left;" %>
            </a>
            <a href="http://www.facebook.com/share.php?u=<%= h "http://#{configatron.site_url}/signup/#{current_user.id}" %>" style="margin-top: 4px;">
              <span style="margin-top: 4px; float:left">Facebook</span>
            </a>
          </div>
          <div id="tweet" class="fleft">
            <a href="http://twitter.com/?status=¿Ya te has apuntado en Fishle? ¡El nuevo concepto de compra! Registrate en <%= h "http://#{configatron.site_url}/signup/#{current_user.id}" %>">
              <%= image_tag "twitter-icon.png", :style => "float: left;" %>
              <span style="margin-top: 4px; float:left">Twitter</span>
            </a>
          </div>
        </div>
      </div>
      <div class="section-medium">
        <p>
          Invita a tus amigos y conseguirás descuentos, packs gratis y acceso a muchas promociones<br/>
          <span class="black10">(Separa los correos electrónicos por comas)</span>

        <p><%= text_field_tag "email", '', :size => 40 %> <%= f.submit "Enviar" %></p>
        </p>
      </div>
  <% end %>

  <div class="section-big">
    <div>

      <div class="clearfix">
        <div class="fleft">
          <p>
            <span class="fleft">Invita a tus contactos</span> 
          <span class="small-image-for-invites fleft">
            <%= image_tag "question-mark.png", :style =>"position:relative; left:6px;", :class => "quest-import", :title => "Selecciona el provedor de servicios e ingresa tu usuario de email para importar tus contactos e invitarlos a fishle de la manera más rapida" -%>
            :
          </span>
            <br/>
          <span class="black10">
            (Recomienda el pack a tus contactos)
          </span>
          </p>
        </div>
        <div class="medium-image-for-invites"><%= image_tag "yahoo.png" -%></div>
        <div class="medium-image-for-invites"><%= image_tag "gmail.png" -%></div>
        <div class="medium-image-for-invites"><%= image_tag "winlive.png" %></div>
      </div>
    </div>
    <div>
      <h4>Tu dirección de correo electrónico</h4>

      <div class="clearfix">
        <div id="import-contacts" class="clearfix">
          <%= render :partial => "shared/import_contacts" %></div>
      </div>
    </div>
  </div>
</div>

这部分是一个使用简单模态jQuery插件的弹出窗口。好? 我想在问题图像中使用tipTip Jquery插件(在代码标记脚本类中)

第一次打开弹出窗口时,tipTip插件工作正常。但是,如果我关闭弹出窗口然后我重新打开弹出窗口,则tipTip会出现故障。

在视口的左上角打开弹出窗口并在firebug控制台中显示下一个错误:

iterator.bind is not a function
[Break On This Error] iterator = iterator.bind(context); 

我需要有关此错误的帮助。

请原谅我的英语语法,并提前致谢

1 个答案:

答案 0 :(得分:0)

问题是,当我再次弹出弹出窗口时,tipTip会丢失上下文处理程序。所以我在我的application.js中重构popUp的代码,首先调用basicmodal函数,然后调用tipTip选择器/附件。

更多稍后我发布了一个例子