$.ajax工作不正常-返回index.html
$.ajax not functioning correctly - returns index.html
我正在尝试编写一个函数,该函数允许我停止在要与之一起使用的每个表单和元素上编写冗余的ajax请求。这是一个非常简单的概念,但我似乎不知道它出了什么问题。我只得到一个错误,但它与一个坏的令牌有关,因为json无效,但如果我删除json函数,它什么都不会做。如果我用返回的数据填充容器,我只会得到索引页的副本。如果有区别的话,这是从索引页运行的。
我只是好奇是否有人看到了我在这里遗漏的任何错误。。。
谢谢!
这是代码
$(document).ready(function(){
/* ajax request standard functions
Optional attributes:
loadtype[html]: prepend, append, html(*complete page load*)
ajaxcon[error]: container to be affected by ajax
method[GET]: post/get
loader[progress1]: alternate load image other than the standard
*/
$(document).on('click', '.ajaxMe', function(e){
e.preventDefault();
var el = $(this); //a, li, form
var tag = el.prop('tagName'); //a, li, form
if(tag == 'FORM'){aType = 1;}else{aType = 2;} //sets default to a/li
var method = el.attr('method');
if(!method) method = 'GET'; //default method
var ajaxcon = el.attr('ajaxcon');
//if there's no ajax container to receive the data, return an error
if(!ajaxcon && aType != 1){
//later on, this should call a function that pops up the error box instead of an alert
alert("There seems to be a code error. Please contact support or try again later");
return false;
}
var loadtype = el.attr('loadtype');
if(!loadtype) loadtype = 'html'; //default loadtype set to html
var altloader = el.attr('altloader');
if(!altloader) altloader = 'http://localhost/mgo/img/gifs/loader.gif'; //default wait image
//set the variables that are determined by the parent element type
if(aType == 1){
var href = el.attr('action');
var sdata = el.serialize(); //We can serialize the data of all forms without checking because checking is going to be done on the php side from now on
}else if(aType == 2){
var href = el.attr('href');
var sdata = el.attr('rel');
}
/*JSON return layout:
return{
status: 0/1 -- included in case there is additional checking on the jquery side before/instead php redirect
message: message to display if bad
badInputs: inputs to highlight
}
*/
alert(sdata);
$.ajax({
type: method,
URL: href,
data: sdata,
success: function(ret){ //return is always going to be JSON
if(aType == 1){
//if data gets returned, it's an error. if no error, the php takes over and forces the next page
var r = $.parseJSON(ret);
el.find('.TopMsg')[loadtype](r.message);
}else if(aType == 2){
ajaxcon[loadtype](ret);
}
}
});
});
});
编辑为了更好地衡量,我添加了html和php
HTML
<form class = 'Frm-cb ajaxMe' id = 'frmsignup' action = 'http://localhost/mgo/modules/signup/php/signup1.php'>
<h1 style = 'background-color: green;'>Sign up now for all the benefits of MGo!</h1>
<div class = 'TopMsg'></div>
<label>email</label>
<input type = 'text' name = 'email' id = 'email'>
<label>confirm email</label>
<input type = 'text' name = 'email2' id = 'email2'>
<label>password</label>
<input type = 'password' name = 'password' id = 'password'>
<label>confirm password</label>
<input type = 'password' name = 'password2' id = 'password2'>
<label>zip code</label>
<input type = 'text' name = 'zip' id = 'zip' maxlength = '5'>
<button type = 'submit'>finish</button>
</form>
PHP
<?
/*
This script is going to do the data validation for the jQuery so users can't hard code the scripts to change validation rules.
The output is JSON.
JSON output map:
[return]
[status]
[badInputs]
[inputname]
[msg]
[addClass]
[changeClass]
*/
include_once "C:/xampp/htdocs/mgo/scripts/php/connect/gen_user_db_connect.php";
include_once "C:/xampp/htdocs/mgo/scripts/php/validate/dataValidation.php";
$bi = array();
$msg = "";
$stat = 1;
$e1 = $_GET['email'];
$e2 = $_GET['email2'];
$p1 = $_GET['password'];
$p2 = $_GET['password2'];
$zip = $_GET['zip'];
$inputs = array("0", "username", "text");
$eChk = validate($e1)['email'];
$pChk = validate($p1)['len'];
$zChk = validate($zip);
if($eChk == 0){
$msg .= "Please enter a valid email address'n";
array_push($bi, "#email");
$stat = 0;
}
if($e1 != $e2){
$msg .= "Emails don't match'n";
array_push($bi, "#email2");
$stat = 0;
}
if($pChk < 6){
$msg .= "Password must be a minimum of 6 characters'n";
array_push($bi, "#password");
$stat = 0;
}
if($p1 != $p2){
$msg .= "Passwords don't match'n";
array_push($bi, "#password2");
$stat = 0;
}
if($zChk['num'] == 0){
$msg .= "Must enter a valid zip code'n";
$stat = 0;
}
$return = json_encode(array("msg" => "<pre>$msg</pre>",
"status" => $stat,
"badInputs" => $inputs));
echo $return;
?>
URL参数的名称不应该大写——"URL"而不是"URL"。
-
你在服务器端进行前端脚本验证(检查篡改)似乎很奇怪,因为如果有人可以篡改脚本,那么他就可以很容易地篡改正在发送的脚本数据,所以这里没有安全性。
-
尝试将
dataType:json
添加到ajax调用中。 -
将
die();
添加到php脚本的末尾,以终止执行。
所以这应该使你的代码成为…
JS
....
alert(sdata);
$.ajax({
type: method,
URL: href,
data: sdata,
dataType:json,
success: function(ret){ //return is always going to be JSON
....
PHP
....
$return = json_encode(array("msg" => "<pre>$msg</pre>",
"status" => $stat,
"badInputs" => $inputs));
echo $return;
die();
?>
相关文章:
- 节点导出返回一个空对象
- ES6构造函数返回基类的实例
- 监视函数从服务返回不起作用,但作用域函数起作用
- Phonegap:监听页面并关闭InAppBrowser返回index.html的简单方法
- JQuery .index() 不返回元素的正确索引
- AngularJS - IE8 - 将$index传递给ng-click中的函数始终返回0并执行多次
- index在应该返回“4”时返回“-1”
- 当index=-1时,JS在请求myArray[index]时返回什么
- $.ajax工作不正常-返回index.html
- Jquery数组[index]返回未定义
- 快速服务器在试图访问index.html时返回Cannot Get
- jQuery:为什么index()在动态改变DOM后返回-1
- Node服务器只返回index.html,不加载bundle.js或其他js文件
- Angular工厂返回index.html作为响应.data而不是JSON
- JSON/Javascript:返回包含某个属性的数组对象的INDEX
- 美元的父母.$index总是返回0
- Cordova PhoneGap-阻止用户返回index.html页面
- 在指令中,$index作为字符串,通过ng个重复返回,在textarea的name属性中使用$index
- Jquery's index()函数返回-1,而不是单击列表项在其父项中的位置
- 将ngInit $index返回给脚本