HTML/PHP 联系表单 safari 问题

Question

我使用html中的联系表单和正确的php代码获得了我的网络，目前在chrome和IE中按预期工作。
但是问题出在野生动物园（iPhone/ipad/...）中，要输入的字段无法正常工作（如果您按Tab而不是用鼠标单击字段，则可以正常工作）。

这是网络 http://www.1x1swap.com/formulario.html

网页代码：

<div class="" id="contact-form">
               <p id="failure">Oops... Algo anduvo mal.</p>  
               <p id="success">Gracias, tu inscripción se ha sido enviado correctamente, lo antes posible nos pondremos en contacto contigo.</p>  
               <form class="form-inline" role="form" action="php/contacto.php" method="post" id="contacto" title="Nombre">  
                  <label for="nombre"><h2 class="colorR tipo16">NOMBRE Y APELLIDOS: <span class="required"></span></label><br>
                  <input class="form-control name=" name="nombre" type="text" required="required" id="nombre" placeholder="Nombre"  title="Nombre"><br>
                  <label for="email"><h2 class="colorR tipo16">CORREO ELECTRÓNICO: <span class="required"></span></label> <br> 
                  <input class="form-control name=" name="email" type="email" required="required" id="email" placeholder="[e-mail]" title="Email"><br>
                  <label for="ciudad"><h2 class="colorR tipo16">CIUDAD: <span class="required"></span></label><br>
                  <input class="form-control name=" name="ciudad" type="ciudad" required="required" id="ciudad" placeholder="Lugar" title="Ciudad"><br>                 
                  <label for="Mensaje"><h2 class="colorR tipo16">MENSAJE: <span class="required"></span></label><br>
                  <textarea class="form-control name=" name="mensaje" rows="4" id="mensaje" placeholder="Dinos aproximadamente que vas a traer. Ej: 6 artículos de ropa y complementos de mujer y 3 libros." ></textarea><br>
                  <input type="submit" name="enviar" value="ENVIAR!" id="submit" />
               </form>  
            </div>

PHP代码：

<?php
if(isset($_POST['enviar'])){
    //Guardamos en variables los datos enviados
    $nombre = utf8_decode($_POST['nombre']);
    $email = $_POST['email'];
    $ciudad = utf8_decode($_POST['ciudad']);
    $mensaje = utf8_decode($_POST['mensaje']);
    ///Validamos del lado del servidor que el nombre y el email no estén vacios
    if($nombre == ''){
        echo "Debe ingresar su nombre";
    }
    else if($email == ''){
        echo "Debe ingresar su email";
}else{
    $para = "[e-mail]";//Email al que se enviará
    $asunto = utf8_decode("Inscripción SWAP");//Puedes cambiar el asunto del mensaje desde aqui
    //Este sería el cuerpo del mensaje
    $mensaje = "
        <table border='0' cellspacing='3' cellpadding='2'>
          <tr>
            <td width='30%' align='left' bgcolor='#f0efef'><strong>Nombre:</strong></td>
            <td width='80%' align='left'>$nombre</td>
          </tr>
          <tr>
            <td width='30%' align='left' bgcolor='#f0efef'><strong>E-mail:</strong></td>
            <td width='80%' align='left'>$email</td>
          </tr>
          <tr>
            <td width='30%' align='left' bgcolor='#f0efef'><strong>Ciudad:</strong></td>
            <td width='70%' align='left'>$ciudad</td>
          </tr>
          <tr>
            <td width='30%' align='left' bgcolor='#f0efef'><strong>Comentario:</strong></td>
            <td width='80%' align='left'>$mensaje</td>       
          </tr>
    </table>    
";  
//Cabeceras del correo
    $headers = "From: $nombre <$email>rn"; //Quien envia?
    $headers .= "X-Mailer: PHP5n";
    $headers .= 'MIME-Version: 1.0' . "n";
    $headers .= 'Content-type: text/html; charset=iso-8859-1' . "rn"; //
//Comprobamos que los datos enviados a la función MAIL de PHP estén bien y si es correcto enviamos
    if(mail($para, $asunto, $mensaje, $headers)){
        echo "Su mensaje se ha enviado correctamente";
        echo "<br />";
        echo '<a href="../formulario.html">Volver</a>';
    }else{
        echo "Hubo un error en el envío inténtelo más tarde";
    }
}
}   
?>

Answer 1

好的，我找到了一种方法来让它工作，看起来 id 造成了一些麻烦，所以 html 代码是这样结束的：

       <form class="form-inline" role="form" action="php/contacto.php" method="post" id="contacto" title="Nombre">  
          <label for="nombre"><h2 class="colorR tipo16">NOMBRE Y APELLIDOS: <span class="required"></span></label><br>
          <input class="form-control" name="nombre" type="text" required="required" placeholder="Nombre"  title="Nombre"><br>
          <label for="email"><h2 class="colorR tipo16">CORREO ELECTRÓNICO: <span class="required"></span></label> <br> 
          <input class="form-control" name="email" type="email" required="required" placeholder="[e-mail]" title="Email"><br>
          <label for="ciudad"><h2 class="colorR tipo16">CIUDAD: <span class="required"></span></label><br>
          <input class="form-control" name="ciudad" type="ciudad" required="required" placeholder="Lugar" title="Ciudad"><br>                   
          <label for="Mensaje"><h2 class="colorR tipo16">MENSAJE: <span class="required"></span></label><br>
          <textarea class="form-control" name="mensaje" rows="4" placeholder="Dinos aproximadamente que vas a traer. Ej: 6 artículos de ropa y complementos de mujer y 3 libros." ></textarea><br>
          <input type="submit" name="enviar" value="ENVIAR!" id="submit" />
       </form>