From mező ellenőrzés DHTML-el és jQuery JavaScript könyvtárral

<style type="text/css">
.form-row {
  padding-bottom: 10px;
  width: 290px;
}
 
.form-row label {
  float: left;
  width: 100px;
  padding-right: 10px;
}
 
.form-row input {
  float: left;
  padding: 3px;
  width: 160px;
}
 
.clear {
  clear: both;
}
 
.form-error {
  text-align: center;
  color: #C52020;
  border: 1px solid #DD7777;
  background: #FFCCCC;
  margin: 10px 0;
  display: none;
}
</style>
 
<div style="margin: 0 auto; width: 300px;">
  <form action="#" method="post">
    <div class="form-row">
      <label for="keresztnev">Keresztnév:</label><input type="text" name="keresztnev" class="kotelezo" id="keresztnev" />
      <div class="clear"></div>
      <div class="form-error hianyos">A keresztnév megadása kötelező!</div>
    </div>
 
    <div class="form-row">
      <label for="vezeteknev">Vezetéknév:</label><input type="text" name="vezeteknev" class="kotelezo" id="vezeteknev" />
      <div class="clear"></div>
      <div class="form-error hianyos">A vezetéknév megadása kötelező!</div>
    </div>
 
    <div class="form-row">
      <label for="email">Email:</label><input type="text" name="email" class="kotelezo email" id="email" />
      <div class="clear"></div>
      <div class="form-error hianyos">Az email cím megadása kötelező!</div>
      <div class="form-error hibas">Nem valós az email cím!</div>
    </div>
 
    <div class="form-row" style="text-align: center;">
      <input type="submit" name="submit" value="Mehet" style="float: none;" />
    </div>
  </form>
</div>

<script type="text/javascript">
 
$(function() {
  $('form').submit(function() {
    var mehet       = true;
    var first_error = true;
    var error_obj   = null;
    $('div.form-error', $(this).parent()).each(function() {
      $(this).hide();
    });
    $('input.kotelezo', $(this).parent()).each(function() {
      if ($(this).val() == '') {
        mehet = false;
        if (first_error) {
          first_error = false;
          error_obj   = $(this);
        }
        $('div.hianyos', $(this).parent()).show();
      }
    });
 
    var email   = $('input.email', $(this).parent()).val();
    var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if (!filter.test(email)) {
      mehet = false;
      if (first_error) {
        first_error = false;
        error_obj   = $(this);
      }
      $('div.hibas', $(this).parent()).show();
    }
 
    if (mehet) {
      return true;
    } else {
      location = '#' + error_obj.attr('id');
      return false;
    }
  });
});
 
</script>

$('div.form-error', $(this).parent()).each(function() {
      $(this).hide();
    });