1 回答

TA貢獻(xiàn)1820條經(jīng)驗 獲得超3個贊
簡短的回答:替換
var b=document.getElementById('angle').value; var o=document.getElementById('vel').value;
和
var b=document.getElementById('angle'); var o=document.getElementById('vel');
和b
和o
和b.value
和o.value
更長的答案:JavaScript中有兩種數(shù)據(jù)類型:原始數(shù)據(jù)類型和引用數(shù)據(jù)類型。當(dāng)您編寫a=b時,如果b是基本類型(數(shù)字、字符串、布爾值、null 或未定義),則您將獲得b的精確副本,但如果b是引用類型(數(shù)組、函數(shù)或?qū)ο螅?,則您將獲得 b 的精確副本。 a只是與b相同的對象的鏈接,修改一個對象也會修改另一個對象。您可以將其視為購買書籍與購買在線課程的訂閱。如果課程內(nèi)容發(fā)生變化,您的書將不會反映它,但如果您有指向它的鏈接,您將能夠看到更新。相當(dāng)于買一本書,同時會給你一個 DOM 對象的鏈接。var b=document.getElementById('angle').value;
var b=document.getElementById('angle');
var b=document.getElementById('angle');
var o=document.getElementById('vel');
var pro = {
x:50,
y:380,
r:15,
v:o.value,
theta:b.value,
};
var canvas = document.getElementById('surface');
var ctx = canvas.getContext('2d');
var frameCount = 0;
var v0x = pro.v * Math.cos(pro.theta * Math.PI/180);
var v0y = pro.v * Math.sin(pro.theta * Math.PI/180);
var startX = pro.x;
var startY = pro.y;
var g = 9.8;
setInterval(function()
{
ctx.save();
ctx.fillStyle = "rgba(256, 256, 256, .3)";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.restore();
if(pro.y<canvas.height - pro.r && pro.x < canvas.width - pro.r)
{
pro.y = startY - ( v0y * frameCount - (1/2 * g * Math.pow(frameCount,2)) );
pro.x = startX + v0x * frameCount;
}
ctx.save();
ctx.beginPath();
ctx.fillStyle = "rgba(200, 0, 0, 0.9)";
ctx.arc(pro.x,pro.y,pro.r,0,Math.PI*2,true);
ctx.fill();
ctx.stroke();
ctx.closePath();
ctx.restore();
frameCount+=.1;
}, 1000 / 77);
function start()
{
pro.x = 50;
pro.y = 380;
pro.v = o.value;
pro.theta = b.value;
frameCount = 0;
v0x = pro.v * Math.cos(pro.theta * Math.PI/180);
v0y = pro.v * Math.sin(pro.theta * Math.PI/180);
}
<canvas id="surface" width="800" height="400"></canvas>
<nav>
<label for="angle">Angle</label>
<input name="angle" type="text" id="angle" value="45" placeholder="angle" oninput="start()"/>
<label for="velocity">Speed</label>
<input type="text" name="velocity" id="vel" value="45" placeholder="velocity" oninput="start()"/>
<input type="reset" value="Launch" onclick="start()">
</nav>
添加回答
舉報