javascript - jquery按钮在条件为真时不显示

Question

关闭。这个问题需要debugging details .它目前不接受答案。












想改进这个问题？将问题更新为 on-topic对于堆栈溢出。

4年前关闭。




Improve this question




当 If/Else 条件为真时，我希望在我的页面上显示一个按钮。
出于某种奇怪的原因，jQuery 方法 .show无法显示按钮，即使控制台确认条件为真，并且该方法应该已被执行。显示地点列表时，19 应该返回“太远”并且按钮保持隐藏状态，而 1 返回“this 返回 true”并显示按钮。

至于 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

问题是您使用的是 visibility: hidden;将其更改为 display: none;在您的 css 中，按钮将按您的意图出现。

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>