2016-08-03 73 views
1

我想通过AJAX提交电子邮件,但由于某种原因,没有任何工作。我有计数器和计数器检查文件(<script src="mail.js"></script>,jqueryurl: "sendmail.php")是否映射良好。通过AJAX调用submision不起作用

页面重新加载,并且不提交任何内容。我不希望任何页面重新加载,我使用AJAX的原因。

我在做什么错?谢谢大家。

的index.html

<!DOCTYPE html> 
<html lang="en"> 

<head> 
<script src="mail.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
</head> 

<body> 

    <!-- Content --> 
    <div class="container"> 
     <div class="row"> 
      <div class="span12 subscribe"> 
       <h3>Subscribe to our newsletter</h3> 
       <p>Sign up now to our newsletter and you'll be one of the first to know when the site is ready:</p> 
       <form class="form-inline" action="" method="post"> 
        <input type="text" name="tasktitle" placeholder="Enter your email..."> 
        <button type="submit" class="btn">Subscribe</button> 
       </form> 
       <div class="success-message"></div> 
       <div class="error-message"></div> 
      </div> 
     </div> 
    </div> 

</body> 

</html> 

在mail.js

$(document).ready(function(){  

    $('.btn').click(function(e){ 

    var current_time = 123; 
    var tasktitle = $("input#tasktitle").val(); 
    var dataString = 'current_time='+ current_time + '&tasktitle=' + tasktitle; 

    $.ajax({ 
     type: "POST", 
     url: "sendmail.php", 
     data: dataString, 

     success: function() { 
     $('.title').html(""); 
     $('.success-message').html("✓ Logged!") 
     .hide() 

     .fadeIn(1500, function() { 
      $('success-message').append(""); 
     }); 
     } 
    }); 
    return false; 

    }); 
}); 

sendmail.php

我已经创建的目录洁净煤的文件被写入。

<?php 
$tasktitle = $_POST['tasktitle']; 
setlocale(LC_TIME, "fi_FI"); 
date_default_timezone_set("Europe/Helsinki"); 
$date = strftime("%Y-%m-%d-%A"); 
$timesaved = strftime("%H:%M:%S"); 
$elapsedtime = $_POST['current_time']; 
$file = "ccts/".$date.".txt"; 
$cont = 'time submitted: '.$timesaved.' - time elapsed: '.$elapsedtime.' - Email Address http://onvill.com/ : '.$tasktitle.''. "n"; 



function isEmail($email) { 
    return(preg_match("/^[-_.[:alnum:]][email protected]((([[:alnum:]]|[[:alnum:]][[:alnum:]-]*[[:alnum:]])\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk|dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum|mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf|tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)$|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i", $email)); 
} 

if($_POST) { 

    // Enter the email where you want to receive the notification when someone subscribes 
    $emailTo = '[email protected]'; 

    $subscriber_email = ($_POST['tasktitle']); 

    if(!isEmail($subscriber_email)) { 
     $array = array(); 
     $array['valid'] = 0; 
     $array['message'] = 'Insert a valid email address!'; 
     echo json_encode($array); 
    } 
    else { 
     $f = fopen ($file, 'w'); 
     fwrite($f, $cont); 
     fclose($f); 

     $array = array(); 
     $array['valid'] = 1; 
     $array['message'] = 'Thanks for your subscription!'; 
     echo json_encode($array); 

     // Send email 
     $subject = 'New Subscriber!'; 
     $body = "You have a new subscriber!\n\nEmail: " . $subscriber_email; 
     // uncomment this to set the From and Reply-To emails, then pass the $headers variable to the "mail" function below 
     //$headers = "From: ".$subscriber_email." <" . $subscriber_email . ">" . "\r\n" . "Reply-To: " . $subscriber_email; 
     mail($emailTo, $subject, $body); 
    } 

} 

?> 

UPDATE

我得到的错误:

Uncaught ReferenceError: $ is not defined(anonymous function) @ mail.js:1 
+0

入住控制台如果Ajax调用工作或没有 –

+0

我得到的错误: \t'未捕获的ReferenceError:$未定义(匿名ous function)@ mail.js:1' –

回答

1

HTML代码

<!DOCTYPE html> 
<html lang="en"> 

<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script src="mail.js"></script> 
</head> 

<body> 

    <!-- Content --> 
    <div class="container"> 
     <div class="row"> 
      <div class="span12 subscribe"> 
       <h3>Subscribe to our newsletter</h3> 
       <p>Sign up now to our newsletter and you'll be one of the first to know when the site is ready:</p> 
       <form class="form-inline" action="" method="post"> 
        <input type="text" name="tasktitle" placeholder="Enter your email..."> 
        <button type="submit" class="btn">Subscribe</button> 
       </form> 
       <div class="success-message"></div> 
       <div class="error-message"></div> 
      </div> 
     </div> 
    </div> 

</body> 

</html> 

在在mail.js

$(document).ready(function(){  

    $('.btn').click(function(e){ 

    var current_time = 123; 
    var tasktitle = $("input#tasktitle").val(); 
    var dataString = 'current_time='+ current_time + '&tasktitle=' + tasktitle; 

    $.ajax({ 
     type: "POST", 
     url: "sendmail.php", 
     data: $("form.form-inline").serialize(), 
     dataType:'json', 
     success: function(data) { 
     if(data.type=="success") 
     { 
      $('.title').html(""); 
      $('.success-message').html("✓ Logged!") 
      .hide() 

      .fadeIn(1500, function() { 
       $('success-message').append(""); 
      }); 
     } 
     else 
     { 
      alert(data.message); 
     } 
     } 
    }); 
    return false; 

    }); 
}); 

在PHP文件

<?php 

$response=array(); 

if(!empty($_POST)) 
{ 
    $tasktitle = $_POST['tasktitle']; 
    setlocale(LC_TIME, "fi_FI"); 
    date_default_timezone_set("Europe/Helsinki"); 
    $date = strftime("%Y-%m-%d-%A"); 
    $timesaved = strftime("%H:%M:%S"); 
    $elapsedtime = $_POST['current_time']; 
    $file = "ccts/".$date.".txt"; 
    $cont = 'time submitted: '.$timesaved.' - time elapsed: '.$elapsedtime.' - Email Address http://onvill.com/ : '.$tasktitle.''. "n"; 

    function isEmail($email) { 
     return(preg_match("/^[-_.[:alnum:]][email protected]((([[:alnum:]]|[[:alnum:]][[:alnum:]-]*[[:alnum:]])\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk|dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum|mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf|tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)$|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i", $email)); 
    } 

    // Enter the email where you want to receive the notification when someone subscribes 
    $emailTo = '[email protected]'; 

    $subscriber_email = ($_POST['tasktitle']); 

    if(!isEmail($subscriber_email)) { 
     $response['type'] = 'error'; 
     $response['message'] = 'Insert a valid email address!'; 
    } 
    else { 
     $f = fopen ($file, 'w'); 
     fwrite($f, $cont); 
     fclose($f); 

     $array = array(); 
     $array['valid'] = 1; 
     $array['message'] = 'Thanks for your subscription!'; 
     echo json_encode($array); 

     // Send email 
     $subject = 'New Subscriber!'; 
     $body = "You have a new subscriber!\n\nEmail: " . $subscriber_email; 
     // uncomment this to set the From and Reply-To emails, then pass the $headers variable to the "mail" function below 
     //$headers = "From: ".$subscriber_email." <" . $subscriber_email . ">" . "\r\n" . "Reply-To: " . $subscriber_email; 
     mail($emailTo, $subject, $body); 
     $response['type'] = 'success'; 
     $response['message'] = 'Mail sent successfully!'; 
    } 

} 
else 
{ 
    $response['type'] = 'error'; 
    $response['message'] = 'Invalid post request'; 
} 
ob_clean(); 
echo json_encode($response); 
+0

@ Program-Me-Rev,你对我所做的事有疑问吗?如果是的话,我在这里解释。 –

0

这是因为序列:

<script src="mail.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 

您在mail.js是在后顶部和jQuery 。但是在mail.js中,您使用的是$,而$在那里不可用。 更改序列并重试。

0

只需要导入jQuery的CDN您在mail.js前

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
    <script src="mail.js"></script> 

jQuery的必须在调用它之前加载。