甜甜圈图有一个称为集团有限公司计划的绿色部分，但它显示了全年的计算。我想展示集团有限公司的月度计划，这将是甜甜圈图中的绿色集团有限公司编号除以12。我很难把我写"；集团有限公司月度计划：；数字没有出现。我尝试过使用document.write和.innerhtml，这是我目前代码中的内容。如果有人能帮我看看我做错了什么，那就太好了，谢谢！
function hpmpGraph() {
var hp = document.hpmpForm.HP.value,
np = hp * .6,
cp = hp - np,
rp = hp / 12,
mp = document.hpmpForm.MP.value,
ap = +mp + +cp,
ctx = document.getElementById('hpmpratio').getContext('2d');
var data = {
labels: ["Income at Risk", "Group LTD Plan"],
datasets: [{
data: [ap, np],
backgroundColor: ["#D9221C", "#17DB4E"],
hoverBackgroundColor: ["#D9221C", "#17DB4E"]
}]
};
var options = {
cutoutPercentage: 65
};
var myChart = new Chart(ctx, {
type: 'doughnut',
data: data,
options: options
});
}
function myFunction() {
var number = 12;
document.getElementById("myText").innerHTML = number;
}<html>
<head>
<title> How much of your income is at risk?
</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js"></script>
<style>
input[type='text'] {
font-size: 14px;
}
</style>
</head>
<body onload="hpmpGraph()" onload="myFunction()" style="background-color:F3FBFF;text-align:center">
<h1 style="text-align:center">
<font face="Verdana" color="2D4C5E" size="9">How much of your income is at risk?</font><br />
</h1>
<form name="hpmpForm" method="post">
Salary :
<input type="text" name="HP" value="180000">
<br> Bonus & Commision :
<input type="text" name="MP" value="50000">
<br>
<button type="button" onclick="hpmpGraph();">Calculate</button>
<h3>Results</h3>
<canvas id="hpmpratio" height="85"></canvas>
</form>
<p>
<font color="#17DB4E">Monthly Group LTD Plan: <span id="myText"></span> </p>
<p>
<font color="#D9221C">Unprotected Monthly Income:</p>
</body>
</html>在body中只能有一个onload函数。我只是在添加你需要做的代码，你实际上可以在hpmpGraph((函数中运行myfunction((，如下所示：
<html>
<head>
<title> How much of your income is at risk?
</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js"></script>
<style>
input[type='text'] { font-size: 14px; }
</style>
</head>
<body onload="hpmpGraph()" style="background-color:F3FBFF;text-align:center">
<script>
function hpmpGraph() {
var hp = document.hpmpForm.HP.value,
np = hp * .6,
cp = hp - np,
rp = hp/12,
mp = document.hpmpForm.MP.value,
ap = +mp + +cp,
ctx = document.getElementById('hpmpratio').getContext('2d');
var data = {
labels: ["Income at Risk","Group LTD Plan"],
datasets:
[{
data: [ap,np],
backgroundColor: ["#D9221C","#17DB4E"],
hoverBackgroundColor: ["#D9221C","#17DB4E"]
}]
};
var options = {cutoutPercentage: 65};
var myChart = new Chart(ctx, {
type: 'doughnut',
data: data,
options: options
});
myFunction()
}
function myFunction() {
var number = 12;
document.getElementById("myText").innerHTML = number;
document.getElementById("mIncome").innerHTML = "$100000";
}
</script>
<h1 style="text-align:center"><font face = "Verdana" color = "2D4C5E" size = "9">How much of your income is at risk?</font><br />
</h1>
<form name="hpmpForm" method="post">
Salary :
<input type="text" name="HP" value="180000">
<br>
Bonus & Commision :
<input type="text" name="MP" value="50000">
<br>
<button type="button" onclick="hpmpGraph();">Calculate</button>
<h3>Results</h3>
<canvas id="hpmpratio" height="85"></canvas>
</form>
<p> <font color = "#17DB4E" >Monthly Group LTD Plan: <span id="myText"></span> </p>
<p> <font color = "#D9221C">Unprotected Monthly Income: <span id="mIncome"></span></p>
</body>