jquery sparklines.js 当我 unhide/toggle a div 时不会显示

jquery sparklines.js will not display when I unhide/toggle a div

我无法 sparklines.js 取消隐藏我的迷你图。我在取消隐藏 div 的函数中包含了 $.sparkline_display_visible() 函数。官方文档非常简单:

来自http://omnipotent.net/jquery.sparkline/#hidden

解决方案是在迷你图可能变得可见时随时调用 $.sparkline_display_visible() 函数,以便可以正确呈现它。这是本网站用来处理隐藏在不同选项卡部分中的迷你图的技术;该站点在选项卡更改回调中调用例程。

<html>
        <script src="/s/js/jquery-1.8.0.min.js"></script>
        <script type="text/javascript" src="/s/js/jquery.sparkline.min.js"></script>
<body>

<button id="neighborhood_standards_button">Sort</button><br>

<div id="neighborhood_standards">
Q117 {{org}} listens and responds appropriately to our questions and concerns. <br><span style="font-size:small">
            (5.4 vs 8.2)</span></td><td>
            <div id="neigh_q117" style="display: inline-block;"></div>
</div>
<div id="smart_sort" style="display:none;">
Q117 {{org}} listens and responds appropriately to our questions and concerns. <br><span style="font-size:small">
            (8.6 vs 8.2)</span>
            <div id="smart_q117" style="display: inline-block;"></div>
</div>            
<script type="text/javascript"> 
$("#smart_q117").sparkline([8.2,8.6,10,8,6],
            {type: 'bullet', 
            rangeColors: ['#f189b1','#f4a0c0','#f9cede'],
            targetWidth: 10,
            targetColor: '#73913b',
            performanceColor: '#c9413f',
            width: '400px'
            });
$("#neigh_q117").sparkline([8.2,5.4,10,8,6],
            {type: 'bullet', 
            rangeColors: ['#f189b1','#f4a0c0','#f9cede'],
            targetWidth: 10,
            targetColor: '#73913b',
            performanceColor: '#c9413f',
            width: '400px'
            });
$(document).ready(function(){
    $("#neighborhood_standards_button").click(function(){
        $("#smart_sort").toggle();
        $("#neighborhood_standards").toggle();
        $.sparkline_display_visible();
    });
    });

    </script>
    </body>
   </html>

所以在经历了通常的头脑风暴和文档重读期之后,我想请大家就我遗漏的内容提出建议。

您必须在 div 中添加一些东西,即粘贴一个 nbsp;里面是空的 div

        <div id="smart_q117" style="display: inline-block;">&nbsp;</div> [see http://jsfiddle.net/WackyDad/utLsfyga/]

PS 你似乎也有一些杂散标签(例如关闭 td 然后打开未关闭且都不在 table 内)