在响应式HTML

时间:2015-10-13 05:54:29

标签: javascript php jquery html

如何为此php表单添加验证,以便验证是否输入了有效的电子邮件,如果未在输入区域下方发布错误消息。我还需要它来确保填写所有字段并且没有输入恶意代码。

有人可以帮忙吗?提前谢谢。



<?php
        $name = $_POST['fullname'];
        $email = $_POST['email'];
        $message = $_POST['message'];
		$subjectCustomer = $_POST['subject'];
        $from = 'Contact Form'; 
        $to = 'test@gmail.com'; 
        $subject = "Message from Contact Form: $subjectCustomer";
		$location = "http://www.domain.com";
        
        $body = "From: $name\n E-Mail: $email\n Message: $message\n";
         
		 
		 ## SEND MESSGAE ##
		 
		 if ($_POST['submit']) {
		 if ($message != '' && $email != '' && $subject != '') {                
         if (mail ($to, $subject, $body, $from)) { 
         	echo '<script type="text/javascript">alert("Your message has been sent!"); location.href="index.html";</script>';
    		} else { 
        	echo '<script type="text/javascript">alert("Something went wrong, go back and try again!"); location.href="index.html/#76industries_contact";</script>'; 
    		} 
			} else {
    		echo '<script type="text/javascript">alert("You need to fill in all required fields!!"); location.href="index.html/#76industries_contact";</script>';
		}
	}
?>
&#13;
<form role="form" method="post" action="contact_form.php" >
          <div class="col-md-3">
          
              <div class="form-group">
                <input name="fullname" type="text" class="form-control" id="fullname" placeholder="Your Name" maxlength="30">
              </div> <!-- end form-group -->
              
              <div class="form-group">
                <input name="email" type="text" class="form-control" id="email" placeholder="Your Email" maxlength="30">
              </div>  <!-- end form-group -->
              
              <div class="form-group">
                <input name="subject" type="text" class="form-control" id="subject" placeholder="Your Subject" maxlength="40">
              </div> <!-- end form-group -->
              
              <div>
              	<input id="submit" name="submit" type="submit" value="Send Message" class="btn btn-primary">
              </div> <!-- end button -->
          </div>  <!-- end col-md-3 -->
          
          <div class="form-group">
           <div class="col-md-9">
            <div class="txtarea">
              <textarea name="message" rows="10" class="form-control" id="message" placeholder="Your Message"></textarea>
            </div>  <!-- end txtarea -->
          </div> <!-- end col-md-9 -->
          <div> <!-- end form-group -->
          
          <div class="form-group">
          	<div class="col-sm-10 col-sm-offset-2">
            <! Will be used to display an alert to the user>
            </div><!-- end col-sm-10 -->
          </div> <!-- end form-group -->
          </div>
          </div>
        </form>
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:1)

这里是电子邮件和名称的jquery验证

$('#submit').click(function(){
                        var uname=$('#fullname').val();
                        if($('#fullname').val().match('[a-zA-Z]+\\.?')){
                             $("#nameerr").css("visibility","hidden");

                                }
                        else{

                                    $("#nameerr").text("FullName is InValid" ) ;
                                     $("#nameerr").css("visibility","visible");
                                    return false;

                                }

                        });





                        $('#submit').click(function(){
                        var email=$('#email').val();
                        if($('#email').val().match('[A-Z0-9a-z._%+-]+@[A-Za-z0-9.-]+\\.[A-Za-z]{2,6}')){
                            $("#emailerr").css("visibility","hidden");
                        }
                        else
                    {
                            $("#emailerr").text("Email Address is InValid.");
                              $("#emailerr").css("visibility","visible");

                            return false;

                    }

                        });

现在你可以添加另一个div空div

<div id="nameerr"> </div>

<div id="emailerr"></div>

现在给他们css:

 #nameerr,#emailerr{    
         color: red;
         background-color:#FFB2B2;
         visibility : hidden;
         font-weight:bold;
         font-size: 12px;
         box-shadow: 0 0 5px rgba(255, 0, 0, 1);
          width: 150%;
         height:10%;   
    }

答案 1 :(得分:0)

如上文评论中所述,您可以使用多种方式来实现您想要的目标。

您可以使用PHP或JQuery。

如果你想使用PHP,你最有可能会做类似的事情:

libx264

这将获取字符串中的所有特殊html字符,并将它们转换为常规的html字符。

您可以在 htmlspecialchars here上阅读更多内容。

注意: 您不希望在电子邮件地址上执行$name = htmlspecialchars($_POST['fullname']); $email = $_POST['email']; $message = htmlspecialchars($_POST['message']); $subjectCustomer = htmlspecialchars($_POST['subject']); 。这将转换htmlspecialchars()并使其无用。

要检查是否填写了所有字段,您可以使用HTML中的@属性。

示例:

required

请注意,我已将该属性放在输入标记内。

答案 2 :(得分:0)

如果您只想实现客户端验证,那么我强烈推荐使用jQuery Validation Plugin,可在此处找到:http://jqueryvalidation.org/

您可以使用一行代码$("#yourFormName").validate();

提交表单

即使您在客户端验证表单的输入,最好首先检查您的变量是否包含某些信息,然后使用以下方法清理数据服务器端: / p>

if(isset($_POST['fullname'])) { $name = addslashes($_POST['fullname'] }