我正在尝试创建一个计算器(表单),允许用户提交一些数据,并在提交后使用plotly.js 绘制图表。现在我只是想获取一个示例图(与数据无关)以在提交空表单时呈现。然而,图表显示一瞬间,然后就消失了。看起来图表在页面刷新半秒后就消失了。我怎样才能防止这种情况发生?
<html>
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<form>
<button type="submit" onclick="calculate()">Calculate</button><br>
</form>
<div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
</body>
<script>
function calculate(){
var data = [
{
x: ['giraffes', 'orangutans', 'monkeys'],
y: [20, 14, 23],
type: 'bar'
}
];
Plotly.newPlot('myDiv', data);
};
</script>
</html>
最佳答案
将按钮类型从“提交”更改为“按钮”
function calculate(){
var data = [
{
x: ['giraffes', 'orangutans', 'monkeys'],
y: [20, 14, 23],
type: 'bar'
}
];
Plotly.newPlot('myDiv', data);
};
<html>
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<form>
<button type="button" onclick="calculate()">Calculate</button><br>
</form>
<div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
</body>
<script>
</script>
</html>
关于javascript - 提交表单时显示的数据暂时可见,然后消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55972829/