当 JavaScript 被禁用时,我的表单出现问题:
- 表单从index.php页面提交
- 收件人收到表格
- 卡在 include.emailSender.php
我缺少什么才能返回原始页面?从网页到处理表单的代码:
<?php include_once('includes/include.contactForm.php'); ?>
include.emailSender.php 文件:
<?php
$contactformRecipient = 'a@b.org';
$contactformTitle = 'Contact from ...';
if($_POST) {
$contactName = addslashes( $_POST['contactName'] );
$contactEmail = addslashes( $_POST['contactEmail'] );
$contactPhone = addslashes( $_POST['contactPhone'] );
$contactMessage = addslashes( $_POST['contactMessage'] );
$message = '';
$message .= 'Name: ' . $contactName . '<br />';
$message .= 'Email: ' . $contactEmail . '<br />';
$message .= 'Phone: ' . $contactPhone . '<br />';
$message .= 'Message: ' . $contactMessage . '<br />';
// Email Headers
$headers = "From: " . $contactEmail . "\r\n";
$headers .= "Reply-To: ". $contactEmail . "\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
// send mail
// mail( to, subject, message, headers, parameters)
mail( $contactformRecipient, $contactformTitle, $message, $headers );
}
?>
include.contactForm.php 文件:
<?php
$randomNumber1 = rand(1, 12);
$randomNumber2 = rand(1, 12);
$contactCaptchaAnswer = $randomNumber1 + $randomNumber2;
?>
<div id="contact-warning">
</div><!-- // #contact-warning -->
<div id="contact-success">
Email successfuly sent, thank you.<br />
</div><!-- // #contact-warning -->
<form name="contactForm" id="contactForm" method="post" action="includes/include.emailSender.php">
<fieldset>
<label for="contactName">Your Full Name <span class="required">*</span></label>
<input name="contactName" type="text" id="contactName" size="60" value="" />
<br />
<label for="contactEmail">Email Address <span class="required">*</span></label>
<input name="contactEmail" type="text" id="contactEmail" size="60" value="" />
<br />
<label for="contactPhone">Phone <span class="required">*</span></label>
<input name="contactPhone" type="text" id="contactPhone" size="60" value="" />
<br />
<label for="contactMessage">Message <span class="required">*</span></label>
<textarea name="contactMessage" id="contactMessage" rows="6" cols="7"></textarea>
<br />
<label for="contactCaptcha"><strong><?php echo $randomNumber1; ?></strong> + <strong><?php echo $randomNumber2; ?></strong> = <span class="required">*</span></label>
<input name="contactCaptcha" type="text" id="contactCaptcha" size="30" value="" />
<input name="contactCaptchaAnswer" type="hidden" id="contactCaptchaAnswer" value="<?php echo $contactCaptchaAnswer; ?>" />
<br />
<label class="placeholder"> </label>
<button class="submit">Submit</button>
</fieldset>
</form>
jQuery 文件:
var isEmail_re = /^\s*[\w\-\+_]+(\.[\w\-\+_]+)*\@[\w\-\+_]+\.[\w\-\+_]+(\.[\w\-\+_]+)*\s*$/;
function isEmail (s) {
return String(s).search (isEmail_re) != -1;
}
$(document).ready(function(){
// Smooth scrolling to internal anchors
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
|| location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 600);
return false;
}
}
});
// ScrollSpy automatically updates nav targets based on scroll position
// http://twitter.github.com/bootstrap/javascript.html#scrollspy
$('#nav').scrollspy();
selectnav('nav');
// Handle Contact Form Submission
$('form#contactForm button.submit').click(function() {
var contactName = $('form#contactForm input#contactName').val();
var contactEmail = $('form#contactForm input#contactEmail').val();
var contactPhone = $('form#contactForm input#contactPhone').val();
var contactMessage = $('form#contactForm #contactMessage').val();
var contactCaptcha = $('form#contactForm input#contactCaptcha').val();
var contactCaptchaAnswer = $('form#contactForm input#contactCaptchaAnswer').val();
var dataString = 'contactName=' + contactName + '&contactEmail=' + contactEmail + '&contactPhone=' + contactPhone + '&contactMessage=' + contactMessage;
var contactError = '';
// Check name
if( contactName == '' ) {
contactError += 'Please enter your name<br />';
}
// Check e-mail
if ( contactEmail == '') {
contactError += 'Please enter your e-mail<br />';
} else if ( isEmail(contactEmail) !== true ) {
contactError += 'Please enter a valid e-mail address<br />';
}
if( contactPhone == '' ) {
contactError += 'Please enter your phone number<br />';
}
if( contactMessage == '' ) {
contactError += 'Please enter your message<br />';
}
if ( contactCaptcha !== contactCaptchaAnswer ) {
contactError += 'Please enter the correct validation value <br />';
}
if ( contactError == '' ) {
$.ajax({
type: "POST",
url: "includes/include.emailSender.php",
data: dataString,
success: function() {
$('#contact-success').fadeIn();
$('form#contactForm').fadeOut();
$('#contact-warning').hide();
}
});
} else {
$('#contact-warning').html(contactError);
$('#contact-warning').fadeIn();
}
return false;
});
});
最佳答案
现在我没有阅读您的所有代码,相反,我想为您提供一些有关 AJAX:ing 表单或其他内容的提示。
不要首先构建 JavaScript + AJAX 版本的表单,从纯版本开始。适用于全局所有类型设备上的浏览器。
完成后,您hijax该表格。使用 jQuery 和 jQuery Form 插件 (http://www.malsup.com/jquery/form/),这再简单不过了。假设您已经设置了表单:
<form method="post" action="some-action.php" id="my-form">
<p><label>Some field<br><input type="text" name="foo"></label></p>
<p><input type="hidden" name="bar" value="1"><input type="submit" value="Go"></p>
</form>
并且您已确保 some-action.php
正确处理表单提交(无需 AJAX),然后只需:
$('#my-form').ajaxForm(function (data) {
alert(data); // data returned by some-action.php
});
现在,如果您想在 some-action.php
中执行不同的操作,具体取决于是否是 AJAX 调用(例如,您可能希望在非 AJAX 调用时重定向回上一页) )你可以简单地检查$_SERVER['HTTP_X_REQUESTED_WITH']
,我通常这样做(你保留常量):
define('XHR', (
isset($_SERVER['HTTP_X_REQUESTED_WITH']) and
strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'
));
然后在some-action.php
中:
if (XHR) {
die(json_encode(array('success' => true)));
}
else {
header('Location: ' . $_SERVER['http_referer']);
}
所谓的渐进增强(最纯粹的版本优先)相对于优雅降级(最精美的版本优先)的好处与移动优先设计的好处相同。它们在其他地方都有更好的解释,例如 Brad Frost 的博客:http://bradfrostweb.com/blog/web/mobile-first-responsive-web-design/
关于php - 当浏览器不允许 JavaScript 时如何在提交后重定向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15512599/