jQuery Form How to - Check if an input is visible

Question

We would like to know how to check if an input is visible.

Answer


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<style type='text/css'>
#addDest, #input2 {<!--  w ww .  j a  v  a  2s.c o m-->
  display: none;
}
</style>
<script type='text/javascript'>
$(window).load(function(){
    $('#a2').click(function() {
        $('#addDest').show();
    });
    $('#addDest').click(function() {
        if ($("#input2").is(':visible')) {
            console.log("test");
        };
        $('#input2').show();
    });
});
</script>
</head>
<body>
  <button id="a2">A2</button>
  <button id="addDest">Add</button>
  <input type="text" id='input2'>
</body>
</html>

The code above is rendered as follows: