jqueryボタンが条件付きで表示されない場合

Question

If/Else条件が真である場合、私のページにボタンが表示されます。 jQueryの方法.showが、コンソールが条件が真であることを確認してメソッドが実行されていても、ボタンが表示されないという奇妙な理由があります。場所のリストを表示するとき、19は「あまりにも遠くに」戻り、ボタンは隠れたままで、1は「これが本当に戻る」を返し、ボタンが表示されます。

checkRadiusまではgoogle.maps.geometry.spherical.computeDistanceBetween（marker .position、userMarker.position）でした。条件付きがtrueを返すとき（ユーザが会場に十分に近い）、ユーザと複数の異なる会場との距離をチェックする。申し訳ありませんが、コードがかなり冗長であれば、私はまだ学習しています。私は6ヶ月未満です！

if(checkRadius <= 35) { 
 
$("#btnId").show(); 
 
console.log("this returns true"); 
 
} else { 
 
console.log("too far away"); 
 
}

#btnId{ 
 
    visibility: hidden; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="btnId">Button</button>

Answer 1

問題は、あなたがそれはあなたのCSSでdisplay: none;にvisibility: hidden;変更を使用していて、あなたがそれを意図したとおりにボタンが表示されることです。

function buttonFunc(checkRadius) { 
 
    if(checkRadius <= 18) { 
 
    $("#btnId").show(); 
 
    console.log("this returns true"); 
 
    } else { 
 
    $("#btnId2").hide(); 
 
    console.log("too far away"); 
 
    } 
 
} 
 

 
var checkRadius = 1; 
 
buttonFunc(checkRadius); 
 

 
var checkRadius = 19; 
 
buttonFunc(checkRadius);

#btnId{ 
 
display: none; /* Use this instead of visibility: hidden; */ 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <button id="btnId">Button</button> 
 
    <button id="btnId2">Button 2</button> 
 
</div>