0

我将此代码用于联系表格: http ://spyrestudios.com/coding-a-minimalist-contact-form-with-captcha-spam-protection/

我有这个菜单列表:

<ul class="menu">
  <li class="company"><a href="#"> company</a>
  <ul>
    <li class="aboutus"><a href="#" >aboutus</a></li>
    <li class="contactus"><a href="#" >contactus</a></li>
  </ul>  
  </li>
  <li class="services"><a href="#">services</a></li>
</ul>

我正在尝试使用 ajax 调用联系表单,如下所示:

$(document).on("click", ".menu li.contactus", function(e) {

  e.stopPropagation();
  $("#contactform").load("contact.php");

});

这是联系表格代码:

<?php
session_start();
?>

 <div id="wrapper">
<div id="contactwrapper">
<form id="contact" name="contact" method="post" action="contact.php" enctype="multipart/form-data">
    <input type="hidden" name="check" value="01">
    <small>*all form fields are required.</small>

    <label for="name" id="namelabel">Name:<span class="err topp">enter your name</span></label>
    <input type="text" name="name" id="name" class="textinput">


    <label for="email" id="emailabel">E-mail:<span class="err topp">enter a valid e-mail address</span></label>
    <input type="email" name="email" id="email" class="textinput">


    <label for="message" id="msglabel">Message:<span class="err txarea">share some stuff with us</span></label>
    <textarea name="message" id="message" class="msgtextarea"></textarea>


    <img src="captcha.php" id="captchaimg">

    <label for="captcha" id="captchalabel">You're not a spammer, right?<span class="err capter">your CAPTCHA code looks wrong</span></label>
    <input type="text" name="captchavalue" id="captchavalue" class="textcaptcha">


    <section id="subber">
    <a href="javascript:void(0);" name="submitlink" id="submitlink" class="btn">Send Message</a>
    </section>
</form>
</div>
   </div>

    <script type="text/javascript">
     function checkValidEmailAddress(emailAddress) {
     var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i);

return pattern.test(emailAddress);
};

var mailsendstatus;
function userSendMailStatus(uname, uemail, umsg, ucaptcha) {
// checking for some valid user name
if(!uname) {
    $("#namelabel").children(".err").fadeIn('slow');
}
else if(uname.length > 3) {
    $("#namelabel").children(".err").fadeOut('slow');       
}

// checking for valid email
if(!checkValidEmailAddress(uemail)) {
    $("#emailabel").children(".err").fadeIn('slow');
}
else if(checkValidEmailAddress(uemail)) {
    $("#emailabel").children(".err").fadeOut('slow');   
}

// checking for valid message
if(!umsg) {
    $("#msglabel").children(".err").fadeIn('slow');
}
else if(umsg.length > 5) {
    $("#msglabel").children(".err").fadeOut('slow');
}

// ajax check for captcha code
$.ajax(
    {
        type: 'POST',
        url: 'captcha_check.php',
        data: $("#contact").serialize(),
        success: function(data) {
            if(data == "false") {
                mailsendstatus = false;
                $("#captchalabel").children(".err").fadeIn('slow');
            }
            else if(data == "true"){
                $("#captchalabel").children(".err").fadeOut('slow');

                if(uname.length > 3 && umsg.length > 5 && checkValidEmailAddress(uemail)) {
                    // in this case all of our inputs look good
                    // so we say true and send the mail
                    mailsendstatus = true;

                    $("#subber").html('<img src="load.gif" alt="loading...">');

                    $.ajax(
                        {
                            type: 'POST',
                            url: 'sendmail.php',
                            data: $("#contact").serialize(),
                            success: function(data) {

                                if(data == "yes") {
                                    alert("aaa");
                                $("#contactwrapper").slideUp(650, function(){
                                    $(this).before("<strong>Yep your mail has been sent!</strong>");
                                });
                                }
                            }
                        }
                    ); // close sending email ajax call 
                } // close if logic for mailsendstatus true
            } // close check CAPTCHA return true
        } // close ajax success callback function
    } // close ajax bracket open
);

return mailsendstatus;
   }

   $(document).ready(function(){
$("#contact").submit(function() { return false; });

$("#submitlink").bind("click", function(e){
    var usercaptvalue = $("#captchavalue").val();
    var subnamevalue  = $("#name").val();
    var emailvalue    = $("#email").val();
    var msgvalue      = $("#message").val();


    var postchecks = userSendMailStatus(subnamevalue, emailvalue, msgvalue, usercaptvalue);
});
  });
</script>

联系表单正在检查验证码并使用 jquery ajax 发送数据。因此,php 页面中的 ajax 代码不起作用。

是否可以在其中调用ajax?

任何帮助,将不胜感激。

4

1 回答 1

0

当你使用load()jQuery 加载 Html。

如果您需要 javascript,请尝试使用$.getScript()从文件中获取指定的 javascript。

您也可以运行 aniframe来避免这种情况,或者尝试将您的联系表单 javascript 嵌入到index页面中。

于 2013-03-12T10:32:44.860 回答