Question

我的菜单中有一个link_to：remote ajax调用，在单击时动态呈现每个页面的内容。所有东西都被调用并且大部分被替换，但是当我第二次点击菜单链接时，D3和vticker只绑定到它们各自的div。这让我相信html / js没有以正确的顺序加载。因此，当它第一次加载时，没有div可以绑定到它。

此外，在替换内容中，我有一个内部ajax查询，根据点击的d3工具提示更新新闻自动收录器，在替换内容后，代码ajax查询不再有效，我得到：

GET http://localhost:3000/render_bubble_partial?data=The+Environment 404 (Not Found)

这是奇怪的，因为它以前工作，我有路线设置：

bubbles_render_bubble_partial GET /bubbles/render_bubble_partial(.:format) bubbles#render_bubble_partial
bubbles_render_poll_partial   GET /bubbles/render_poll_partial(.:format)   bubbles#render_poll_partial
bubbles_render_bubble_content GET /bubbles/render_bubble_content(.:format) bubbles#render_bubble_content

菜单中的li部分：

<li id='panel-3'><%= link_to image_tag('keyBubble.png'), bubbles_render_bubble_content_path, :remote => true %></li>

我正在呈现的部分内容：

<div class="col span_5_of_7">
    <section id="infographic">
        <div id ="infographicContent">
            <input id="slider" style="position:inherit;top:4px;" type="range" min="0" max="62" value="0"> </input>
            <div id="tooltip">
            </div>
            <%= javascript_include_tag "http://d3js.org/d3.v3.min.js" %>
            <%= javascript_include_tag "bubbles", "vticker" %>
            <script>
                $('.col.span_5_of_7').click(function(){
                      var text = $("#tooltip b").text();
                        if(text == ""){text = null}
                        var params = {data:text};
                        console.log(params)
                        $.ajax({
                          url: "render_bubble_partial",
                          data: params, 
                          success: function(result) {
                               console.log("finished ajax callback");
                          }
                        });
              });
            </script>   
        </div>
    </section>  
</div>
<div class="col span_1_of_7">
    <section id="feed">
        <div id ="infoFeed">
            <ul style="font: 10px sans-serif;text-align: justify;">
                <% bubble_query(nil) %>
                <% @bubble_story.each do |story| %>
                    <li style="border-style:solid;border-top:thick double #000;">
                        <p><h4 style="text-align:left;"><%= link_to story.title, story.url, :target => "_blank" %>
                            </h4> <%= story.description %> <h7><br /><br /><%= story.source %><br /><%= story.date.to_date %><%= story.issue %></h7></p>
                    </li>
                <% end %>
            </ul>
        </div>
    </section>
    <script> $(function() { $('#infoFeed').vTicker();});</script>
</div>

我不确定如何解决这个问题......有人可以提供一些建议吗？

Answer 1

你是否正在调用ajax从ajax本身正在更新的部分中重新加载部分？如果是这样，请尝试将其移出。您可以尝试将javascript移动到应用程序布局或application.js文件。

Answer 2

但是在部分和应用程序布局之间移动javascript_include_tags，我能够正确加载它。

让html和javascript以正确的顺序加载到rails中

2 个答案: