0

Ruby on Rails の Fancybox にリンクする 2 つのリンクがあります。

リンク 1 のクラス: 「why_am_i_here fancybox」 リンク 2 のクラス: 「feedback_link fancybox」

初めてリンク 1 をクリックすると、リンク 2 のファンシーボックスに移動します。もう一度クリックすると、正しいリンクに移動します。もう一方のボタン (リンク 2) は正常に機能します。

関連するかもしれないし関連しないかもしれないあらゆる種類のコードであなたを侵略するのではなく、あなたが必要とするさらなる情報を教えてください。

これは、why_am_i_here のレンダリングされた HTML です (リンク 1)。

$(function(){
    var search_value;
    $(".why_am_i_here_button, .fancybox").fancybox({
        type : 'iframe',
        autoSize : true,
        afterLoad : function(){
                $(".fancybox-iframe").contents().find(".feedback_link").remove();
                $(".fancybox-iframe").contents().find("#app_header_right").remove();
                $(".fancybox-iframe").contents().find("#feed").remove();
            $(".fancybox-iframe").contents().find("#search_submit").unbind("type"); 
            block_off_default_clicks();
            set_click_listeners();
            $(".fancybox-iframe").contents().find("#search_submit").click(function(e){
                e.preventDefault();
                parent.$.fancybox.close();

            });
        },
        beforeClose : function(){
            search_value = $(".fancybox-iframe").contents().find('#search').val();
        },
        afterClose : function(){
            if (search_value){
                $("#searchbox_holder").html("<%= escape_javascript(render 'restaurants/searchbox') %>");
                $("#search").attr("value", search_value);
                $("#user_edit_wrapper").hide();
                $(".search_form").submit();
            }
        }
    }).eq(0).click().stopPropagation();

});

これは、feedback_link (リンク 2) のレンダリングされた HTML です。

$(function(){
    $(".feedback_link, .fancybox").fancybox({
        type : 'iframe',
        afterLoad : function(){
            $(".fancybox-iframe").contents().find(".feedback_link").remove();
            $(".fancybox-iframe").contents().find("#feed").remove();
                $(".fancybox-iframe").contents().find("#app_header_right").remove();
            block_off_default_clicks();

            $(".fancybox-iframe").contents().find(".feedback_form").submit(function(e){
                parent.$.fancybox.close();
            });
        }
    }).eq(0).click().stopPropagation();

});

各リンクの HTML は次のとおりです。

リンク 1:

<div id = "why_am_i_here_container">
<%= link_to "Here\'s how it works", info_path(:welcome => params[:welcome]), :remote => true, :class => "why_am_i_here_button fancybox rounded-corner", :id => "why_am_i_here" %></div>

リンク 2:

<li class = "app_header_item"><%= link_to 'Feedback (please)', new_feedback_path, :remote => true, :class => "feedback_link fancybox", :id => "feedback_link" %></li>
4

1 に答える 1

0

コードを前後に動かして何をしているのかを追跡するのは難しいですが、私がすることは次のとおりです。

リンク 1:

<div id = "why_am_i_here_container">
<%= link_to "Here\'s how it works", info_path(:welcome => params[:welcome]), :remote => true, :class => "why_am_i_here_button rounded-corner", :id => "why_am_i_here" %>
</div>

リンク 2

<li class = "app_header_item"><%= link_to 'Feedback (please)', new_feedback_path, :remote => true, :class => "feedback_link", :id => "feedback_link" %></li>

fancybox両方のリンクからクラスを削除したことに注意してください。

次にjQueryコード：

$(function () {
    var search_value;
    $(".why_am_i_here_button").fancybox({
        // options for why_am_i_here_button
        type: "iframe" // etc
    });
    $(".feedback_link").fancybox({
        // options for feedback_link
        type: "iframe" // etc
    });
}); // ready

どちらの init も同じ$(function(){})ready メソッド内にあります。上記のコードは機能するはずです。

何に使用しているのかわかりませんが.eq(0).click().stopPropagation();、今は削除してリンクをテストしてください。

于 2013-05-03T06:50:00.807 に答える