我想寫這樣的代碼:
if ( [*distance between two objects*] = [*for example: 20px*] ) {
[*run someFunction()*]
}
我寫了很多不同的代碼和邏輯,但對我來說沒什么不同......
也許我必須使用勾股定理,像這樣?
var a = x1 - x2;
var b = y1 - y2;
var c = Math.sqrt( a*a b*b );
// c is the distance
但是我如何才能實際使用它來獲得這樣的東西:
if ( [*distance between two objects*] = [*for example: 20px*] ) {
[*run someFunction()*]
}
如果可以,請你幫助我...
uj5u.com熱心網友回復:
您可以在兩個函式中重新組織代碼以使其更具可讀性。然后在條件中使用該函式。
function distance(x1, x2){
var a = x1 - x2;
var b = y1 - y2;
var c = Math.sqrt( a*a b*b );
return c;
}
if(distance (x1, x2) > 20){
someFunction()
}
如果要計算兩個物件之間的距離,可以使用jQuery的offset()函式獲取左上角,使用width()和height()獲取右下角
在這里閱讀更多https://api.jquery.com/offset/
或者你可以在這里閱讀:關于如何在 vanilla js 中執行類似于 jQuery.offset() 的純 JavaScript 函式?
uj5u.com熱心網友回復:
為了得到你想做這樣的事情的距離。
請記住,因為我正在使用顯示行內塊,它在元素之間添加了一點額外的邊距,因此額外的 px 位。
window.onload = function() {
var eleY = document.getElementById('y'),
eleX = document.getElementById('x'),
y = eleY.getBoundingClientRect().left,
x = eleX.getBoundingClientRect().right,
distance = y - x;
eleY.innerHTML = 'y = ' y;
eleX.innerHTML = 'x = ' x;
document.getElementById('distance').innerHTML = 'distance = ' distance;
if(distance == 138){
alert('JUMP');
}
}
div {
padding:35px 0;
width: 80px;
display: inline-block;
text-align:center;
vertical-align:middle;
}
#x {
background: red;
}
#distance {
width:100px;
padding:10px 5px;
color:#fff;
background:green;
margin:0 10px;
}
#y {
background: yellow;
}
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
</script>
</head>
<body>
<div id="x"></div>
<div id="distance"></div>
<div id="y"></div>
</body>
</html>
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/405410.html
標籤:
上一篇:需要幫助轉換GraphQL結果
