jQuery $(document).ready 在某些情况下不工作

jQuery $(document).ready not working in some cases

我正在使用c3 绘制一些图表。由于 c3 不允许我以我想要的方式编辑轴标签,因此我在加载图表后使用 jQuery 对其进行编辑。 (仅供参考,我试图在 y 轴上显示 1-24,再次显示 1-24,而不是 1-48 小时)。无论如何,我无法让它工作。我把代码放在 (document).ready.

<!-- jQuery -->
<script src="../jquery/dist/jquery.min.js"></script>


<script type="text/javascript">
    $(document).ready(function() {
        $("#c3-chart2").hide();

        $('input[type="radio"]').click(function() {
            if ($(this).attr("value") == "chart1") {
                $("#c3-chart2").hide();
                $("#c3-chart1").show();
            }
            if ($(this).attr("value") == "chart2") {
                $("#c3-chart1").hide();
                $("#c3-chart2").show();
            }
        });

        $("#button").click(function() {
            $("#c3-time-chart .c3-axis-y .tick text tspan").text("lol");
        }); 

        $("#c3-time-chart .c3-axis-y .tick text tspan").text("lol");

    });

<body> 
    The chart ids are here
</body>

<!-- C3 and D3 Charts-->
    <script src="../d3/d3.min.js" charset="utf-8"></script>
    <script src="../c3/c3.min.js"></script>
    <script src="../graphs/d3-test-data.js"></script>
    <script src="../graphs/c3-test-data.js"></script>

我尝试从 google chrome 控制台更改标签并且成功了。我还添加了一个按钮,当我点击它时会更改标签。他们两个都很有魅力。但不知何故,我无法在页面加载后自动执行此操作。所有类似的问题都有答案,比如把代码放在 (document).ready 中,我已经在做。请帮我找出问题所在。

Document.ready 关闭,否则按钮点击将永远不起作用。问题是 Document.ready 在文档完成时触发,但在触发所有 JavaScript 之后不是必需的(例如创建 d3 图表的逻辑)。所以您需要运行您的图表创建后的文本修改代码。

关于如何获得这个的伪代码想法是 运行 使用 jQuery 检查该节点是否存在的 setInterval 然后设置值并销毁间隔,但如果节点不存在' t 存在然后重复间隔。