mudar foco com javascript

[_SDinfo 3]

Tenho um formulário web que imprime na tela dois tipo de aviso. Quando todos os campos são preenchidos ele retorna a página php com a mensagem: Enviado com sucesso!

 

Quando o usuário deixa de preencher alguma coisa, é retornada a página com a seguinte mensagem: Favor preencher todos os campos!

 

Como antes deste formulário existe algum conteúdo, o foco vai para o inicio da página, mas eu gostaria que este foco fosse para um local especifico, como por exemplo para o local onde as mensagens de formulário enviado ou não, aparecem. Como ficaria este código javascript?

[Lucas Peperaio 20]

nomedocampo.focus()

[_SDinfo 3]

Como mudar o foco para um campo mais ou menos assim:

 

<div id="erro"> Aqui fica a mensagem de erro </div>

[Lucas Peperaio 20]

seria assim:

<script type="text/javascript">
document.getElementById("erro").focus();
</script>

[_SDinfo 3]

Problema real:

 

<?php session_start();
/**
* Template Name: Contact Form
*/

global $theme; get_header(); ?>

   <div id="main">

       <?php $theme->hook('main_before'); ?>

       <div id="content">

           <?php $theme->hook('content_before'); ?>

           <?php 
               if (have_posts()) : while (have_posts()) : the_post();
                   /**
                    * Find the post formatting for the pages in the post-page.php file
                    */
                   get_template_part('post', 'page');
               endwhile;

               else :
                   get_template_part('post', 'noresults');
               endif; 
           ?>

           <div class="contact-form">
               <?php

                   if ($_POST['contact_form_submit'] ) {
                       if(!$_POST['contact_form_name'] || !$_POST['contact_form_email'] || !$_POST['contact_form_subject'] || !$_POST['contact_form_question'] || !$_POST['contact_form_message']) {
/* quero mudar o foco para este local. */
                           ?><div class="error"><?php _e('Por favor, preencha todos os campos obrigatórios!','themater'); ?></div><?php
                       } elseif(!is_email($_POST['contact_form_email'])) {
                           ?><div class="error"><?php _e('Invalid email!','themater'); ?></div><?php
                       } elseif(($_SESSION['contact_form_number_one'] + $_SESSION['contact_form_number_two']) != $_POST['contact_form_question']) {
                           ?><div class="error"><?php _e('You entered the wrong number in captcha!','themater'); ?></div><?php
                       } else {
                           wp_mail($theme->get_option('contact_form_email'), sprintf( '[%s] ' . esc_html($_POST['contact_form_subject']), get_bloginfo('name') ), esc_html($_POST['contact_form_message']),'From: "'. esc_html($_POST['contact_form_name']) .'" <' . esc_html($_POST['contact_form_email']) . '>');
                           unset($_POST);
                           ?><div class="message"><?php _e('Enviado com sucesso! Obrigado por entrar em contato conosco.','themater'); ?></div><?php
                       }
                       if ( isset($_SESSION['contact_form_number_one'] ) ) unset( $_SESSION['contact_form_number_one'] );
                       if ( isset($_SESSION['contact_form_number_two'] ) ) unset( $_SESSION['contact_form_number_two'] );
                   }

                   if ( !isset($_SESSION['contact_form_number_one'] ) ) $_SESSION['contact_form_number_one'] = $contact_form_number_one = rand(1, 9);
               	else $contact_form_number_one = $_SESSION['contact_form_number_one'];

               	if ( !isset($_SESSION['contact_form_number_two'] ) ) $_SESSION['contact_form_number_two'] = $contact_form_number_two = rand(1, 9);
               	else $contact_form_number_two = $_SESSION['contact_form_number_two'];
               ?>

               <form method="post" action="">
                   <input type="hidden" name="contact_form_submit" value="true" />
                   <div class="contact-form-label alignleft <?php if($_POST && !$_POST['contact_form_name']) { echo 'contact-form-required'; } ?>"><?php _e('Name','themater'); ?>:</div>
                   <div class="contact-form-input"><input type="text" name="contact_form_name" value="<?php if ( isset($_POST['contact_form_name']) ) { echo esc_attr($_POST['contact_form_name']); } ?>" /></div>

                   <div class="contact-form-label alignleft <?php if($_POST && !$_POST['contact_form_email']) { echo 'contact-form-required'; } ?>"><?php _e('Email','themater'); ?>:</div>
                   <div class="contact-form-input"><input type="text" name="contact_form_email" value="<?php if ( isset($_POST['contact_form_email']) ) { echo esc_attr($_POST['contact_form_email']); } ?>" /></div>

                   <div class="contact-form-label alignleft <?php if($_POST && !$_POST['contact_form_question']) { echo 'contact-form-required'; } ?>"><?php echo $contact_form_number_one; ?> + <?php echo $contact_form_number_two; ?> = ?</div>
                   <div class="contact-form-input"><input type="text" name="contact_form_question" value="" /></div>

                   <div class="contact-form-label alignleft <?php if($_POST && !$_POST['contact_form_subject']) { echo 'contact-form-required'; } ?>"><?php _e('Assunto','themater'); ?>:</div>
                   <div class="contact-form-input"><input type="text" name="contact_form_subject" value="<?php if ( isset($_POST['contact_form_subject']) ) { echo esc_attr($_POST['contact_form_subject']); } ?>" /></div>

                   <div class="contact-form-label alignleft <?php if($_POST && !$_POST['contact_form_message']) { echo 'contact-form-required'; } ?>"><?php _e('Mensagem','themater'); ?>:</div>
                   <div class="contact-form-input"><textarea name="contact_form_message" ><?php if ( isset($_POST['contact_form_message']) ) { echo esc_textarea($_POST['contact_form_message']); } ?></textarea></div>

                   <div class="contact-form-label alignleft"> </div>
                   <div class="contact-form-input" style="text-align: center;"><input type="submit" value="<?php _e('Enviar','themater'); ?>" /></div>
               </form>

           </div>

           <?php $theme->hook('content_after'); ?>

       </div><!-- #content -->

       <?php get_sidebars(); ?>

       <?php $theme->hook('main_after'); ?>

   </div><!-- #main -->

<?php get_footer(); ?>

 

No código acima existe uma marcação "/* quero mudar o foco para este local. */", é justamente para a linha seguinte que quero mudar o foco, a linha que possui o seguinte trecho de código:

 

<div class="error"><?php _e('Por favor, preencha todos os campos obrigatórios!','themater'); ?></div>

Como fazer?

[Lucas Peperaio 20]

Ué, da mesma forma que eu passei ali. Quando o Wordpress disparar o erro (talvez você terá que configurar o arquivo wp-comments-post.php), você envia como resposta um script, semelhante aquele que eu passei ali. Como o identificador da DIV é uma classe (error), é só fazer assim:

 

<script type="text/javascript">
document.getElementsByClassName("error").focus();
</script> 

[_SDinfo 3]

Tentei fazer isso ao submeter o formulário, mas não obtive sucesso não.