javascript - jquery 将 div 元素可见性检测为 true，即使不可见

Question

我有一个简单的表单，我有 jquery 代码来确定带有 id="placeholder"的 div 元素是否可见。如果它可见，则显示一个带有错误消息的警告框，如果不可见，则显示一个带有 ok 消息的警告框。问题是当我单击提交按钮时，它在警告框中显示错误消息而不是 OK 警告消息。令人费解的是，即使 div 元素没有 innerHTML 文本，它仍然显示错误更改框。代码可能有什么问题？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<form>
  <fieldset>
    <legend>Your Information:</legend>
    First name:
    <br>
    <input type="text" name="firstname">
    <br>Last name:
    <br>
    <input type="text" name="lastname">
    <br>
    <br>
    <input type="button" value="Submit" onclick="dopost()">
  </fieldset>
</form>

<div id="placeholder"></div>

<script>
  function dopost() {

    if ($('#placeholder').is(':visible')) {

      alert('Found errors in the form, please correct them!');

    } else {

      alert('no errors');

    }

  }
</script>

Answer 1

试试这个。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<form>
  <fieldset>
    <legend>Your Information:</legend>
    First name:
    <br>
    <input type="text" name="firstname">
    <br>Last name:
    <br>
    <input type="text" name="lastname">
    <br>
    <br>
    <input type="button" value="Submit" onclick="dopost()">
  </fieldset>
</form>

<div id="placeholder" style="visibility:hidden;"></div>

<script>
  function dopost() {
     
    if ($('#placeholder').attr('visibility')=='visible') {

      alert('Found errors in the form, please correct them!');

    } else {

      alert('no errors');

    }

  }
</script>