我为客户创建了一个自定义表单，该客户的网站是在我公司的登台服务器上构建的。表单在我们的登台服务器上正常工作，但现在我将其移动到客户端的服务器上，它已不再有效。在JS内部，ajax正在调用apex-email.php的绝对URL来处理表单。我确实缩小了，如果我使用URL到我们的登台服务器上文件的位置，它就可以了。如果我将其更改为位于其服务器上的位置，则它无法正常工作，因此我假设它是ajax问题？这是我的代码：
HTML：
<form id="apex-form" class="form-horizontal">
<div class="form-group col-md-6">
<label class="col-sm-12" for="firstname">First name: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="firstname" id="firstname">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="lastname">Last name: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="lastname" id="lastname">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="name">Email: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="email" name="email" id="email">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="phone">Phone: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="tel" name="phone" id="phone">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="company">Company Name: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="company" id="company">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="website">Website URL:</label>
<div class="col-sm-12">
<input class="form-control" type="text" name="website" id="website">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group col-md-12">
<label class="col-sm-12" for="address">Street Address: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="address" id="address">
</div>
</div>
<div class="form-group col-md-12">
<label class="col-sm-12" for="addresstwo">Address Line 2:</label>
<div class="col-sm-12">
<input class="form-control" type="text" name="addresstwo" id="addresstwo">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="city">City: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="city" id="city">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="state">State: <span class="red-star">*</span></label>
<div class="col-sm-12">
<select class="form-control validate[required]" name="state" id="state">
<option value="">Please Select One</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District Of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="zip">Zip: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="zip" id="zip">
</div>
</div>
<div class="clearfix"></div>
<hr/>
<div class="form-group col-md-6">
<label class="col-sm-12" for="numbercustomers">Number of Customers: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="number" name="numbercustomers" id="numbercustomers">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="averageemp">Average Number of Employees per Customer: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="number" name="averageemp" id="averageemp">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="numberchecks">Number of Checks Per Month: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="number" name="numberchecks" id="numberchecks">
</div>
</div>
<div class="form-group col-md-6">
<label class="col-sm-12" for="currentsoftware">Current Payroll Software: <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="currentsoftware" id="currentsoftware">
</div>
</div>
<div class="clearfix"></div>
<div class="form-group col-md-12">
<label class="col-sm-12" for="howhear">How did you hear about us? <span class="red-star">*</span></label>
<div class="col-sm-12">
<input class="form-control" type="text" name="howhear" id="howhear">
</div>
</div>
<div class="form-group col-md-12"><label class="col-sm-12" for="addcomments">Additional Comments:</label><br/>
<div class="col-sm-12"><textarea name="addcomments" id="addcomments" class="form-control col-sm-12 textarea" rows="3"></textarea></div>
</div>
<div class="form-group col-md-12"><button type="submit" name="send" class="free-button btn btn-default" id="submitBtn">Submit</button></div>
</form>
JS：
$('#apex-form').validate({ // initialize the plugin
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
email: {
required: true,
email: true
},
phone: {
required: true
},
company: {
required: true
},
address: {
required: true
},
city: {
required: true
},
state: {
required: true
},
zip: {
required: true
},
numbercustomers: {
required: true
},
averageemp: {
required: true
},
numberchecks: {
required: true
},
currentsoftware: {
required: true
},
howhear: {
required: true
}
},
submitHandler: function(form) {
var data = $(form).serialize();
$.ajax({
type: 'POST',
url: 'http://mycompanysstagingsite.com/wp-content/themes/apex/apex-email.php',
data: $("#apex-form").serialize(),
success: function(d){
$(".form-wrap").hide();
$(".result").show(d);
}
});
}
});
顶点-email.php：
<?php
$to = 'example@email.com';
$subject = 'Example Subject';
date_default_timezone_set("America/New_York");
$emailTime = date('Y-m-d H:i:s');
$firstname = 'First Name: ' . $_POST['firstname'] . "\r\n";
$lastname = 'Last Name: ' . $_POST['lastname'] . "\r\n";
$email = 'Email: ' . $_POST['email'] . "\r\n";
$phone = 'Main Phone: ' . $_POST['phone'] . "\r\n";
$company = 'Company Name: ' . $_POST['company'] . "\r\n";
$website = 'Website: ' . $_POST['website'] . "\r\n";
$address = 'Address 1: ' . $_POST['address'] . "\r\n";
$addresstwo = 'Address 2: ' . $_POST['addresstwo'] . "\r\n";
$city = 'City: ' . $_POST['city'] . "\r\n";
$state = 'State: ' . $_POST['state'] . "\r\n";
$zip = 'Zip: ' . $_POST['zip'] . "\r\n";
$referral = 'Referral: Apex Contact Info Web Form' . "\r\n";
$numbercustomers = '# of Clients: ' . $_POST['numbercustomers'] . "\r\n";
$averageemp = 'Active # of EEs: ' . $_POST['averageemp'] . "\r\n";
$numberchecks = '# of Checks/Month: ' . $_POST['numberchecks'] . "\r\n";
$currentsoftware = 'Current Software: ' . $_POST['currentsoftware'] . "\r\n";
$addcomments = "Prospect's Comments: " . $_POST['addcomments'];
$emailmessage = $firstname .' '. $lastname .' '. $phone .' ' . $email .' ' . $company .' ' . $website .' ' . $address .' ' . $addresstwo .' ' . $city .' ' . $state .' ' . $zip .' ' . $referral .' ' . $numbercustomers .' ' . $averageemp .' ' . $numberchecks .' ' . $currentsoftware .' ' . $addcomments;
$headers = 'From: example@email.com ' . "\r\n"; // From email
$headers .= 'Cc: ' . "\r\n";
$headers .= 'Bcc: ' . "\r\n";
$headers .= 'Return-Path : ' . "\r\n";
$headers .= 'X-Mailer: PHP' . "\r\n";
$headers .= 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-Type: text/html; charset=iso-8859-1' . "\r\n";
mail($to, $subject, $emailTime, $emailmessage, $headers);
?>
编辑：我正在研究这可能是GoDaddy问题，以及他们如何在他们的最终配置事物。
答案 0 :(得分：1)
您有跨源脚本问题：
XMLHttpRequest cannot load http://inwardstaging.com/apex2/wp-content/themes/apex/apex-email.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.thepayrollcloud.com' is therefore not allowed access.
您需要在apex-email.php脚本中添加跨源友好标题，即：
<?php header("Access-Control-Allow-Origin: www.thepayrollcloud.com");
或者，如果您不担心访问它的任何网站的安全性：
<?php header("Access-Control-Allow-Origin: *");
或者更改www.thepayrollcloud.com上脚本的位置，使其指向网站本地的副本（如果该文件具有相同的文件）。 （可能是最好的解决方案）
url: '/wp-content/themes/apex/apex-email.php',
答案 1 :(得分：0)
试图玩你的代码，我认为更好地替换div的内容如：
submitHandler: function(form) {
var data = $(form).serialize();
$.ajax({
type: 'POST',
url: 'http://mycompanysstagingsite.com/wp-content/themes/apex/apex-email.php',
data: $("#apex-form").serialize(),
success: function(d){
$(".form-wrap").hide();
$(".result").html(d);
}
});
}
我还添加了表单并在类结果中添加空div：
<div class="form-wrap">
<form id="apex-form" class="form-horizontal">
//your form contents
</form>
</div>
<div class="result"></div>
答案 2 :(得分：0)
就像我怀疑的那样，它与Cross Origin无关（因为它在同一台服务器上调用了一个文件......没有涉及交叉）。它与标题的设置方式有关。 $emailTime变量导致表单在提交时中断。显然，这不是标题的正确格式。当我将$emailTime作为$emailmessage的一部分时，表单提交得很好。