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 存在然后重复间隔。
我正在使用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 存在然后重复间隔。