<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class="col-md-8 offset-md-2"> <h1>Form contatto <a href="http://pierpaolodidato.it">pierpaolodidato.it</a> </h1> <p class="lead">Questa è un semplice form di contatto. Puoi trovare altri snippet pronti all'uso sulla mia pagina personale</p> <form id="contact-form" method="post" action="" role="form"> <div class="controls"> <div class="row"> <div class="col-lg-6"> <div class="form-group"> <label for="form_name">Nome *</label> <input id="form_name" type="text" name="name" class="form-control" placeholder="Inserisci il tuo nome *" required="required" data-error="Firstname is required."> <div class="help-block with-errors"></div> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label for="form_lastname">Cognome *</label> <input id="form_lastname" type="text" name="surname" class="form-control" placeholder="Inserisci il tuo cognome *" required="required" data-error="Lastname is required."> <div class="help-block with-errors"></div> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="form-group"> <label for="form_email">Email *</label> <input id="form_email" type="email" name="email" class="form-control" placeholder="Inserisci la tua email *" required="required" data-error="Valid email is required."> <div class="help-block with-errors"></div> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label for="form_phone">Telefono</label> <input id="form_phone" type="tel" name="phone" class="form-control" placeholder="Inserisci il tuo numero di telefono"> <div class="help-block with-errors"></div> </div> </div> </div> <div class="form-group"> <label for="form_message">Messaggio *</label> <textarea id="form_message" name="message" class="form-control" placeholder="Testo*" rows="4" required="required" data-error="Please, leave us a message."></textarea> <div class="help-block with-errors"></div> </div> <div class="row"> <div class="col-lg-6"> <div class="form-group"> <label for="form_captcha"><span id="t1"></span>+<span id="t2"></span> *</label> <input type="text" class="form-control" id="form_captcha" required placeholder="Inserisci il risultato"> <div class="help-block with-errors"></div> </div> </div> </div> <input type="submit" class="btn btn-primary btn-send" value="Invia il messaggio"> <p class="text-muted"> <strong>*</strong> I campi contrassegnati dall'asterisco sono obbligatori </p> </div> </form> </div> <!-- /.8 --> </div> <!-- /.row--> </div> <!-- /.container-->

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #007bff !important; opacity: 1; /* Firefox */ } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #007bff !important; } ::-ms-input-placeholder { /* Microsoft Edge */ color: #007bff !important; }

$( document ).ready(function() { var t1=$('#t1').text(Math.floor((Math.random() * 100) + 1)); var t2=$('#t2').text(Math.floor((Math.random() * 100) + 1)); });