标签:client min 期望 success 它的 org remove 出错 get
<?php /* * 保护AJAX请求的方式 */ /* * 1. 防止表单的自己主动提交 * 对表单的submit提交进行控制。
设置一个全局变量submitError,在进行验证的方法体中对submitError进行改动。 * 若出错,submitError++; 若错误更正submitError--;提交之前。若submitError=0,则进行提交 */ ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="jquery-1.5.min.js"></script> <style> .pwd{ width:200px; height:35px; } </style> <title>无标题文档</title> </head> <body> <form id="rg_user" > <div> <input type="password" size="12" id="rg_pwd" class="pwd" /> <div id="error_info" ></div> </div> <input type="submit" /> </form> <script type="application/javascript"> var submtError=0; /* * 提交前验证password是否为空 */ $('input[type="submit"]').click( function(){ var pwd_length=$('#rg_pwd').val().length; if(pwd_length==0){ $('#error_info').html("password为空"); submitError++; } if(submitError==0){ $('rg_user').submit( function(e){ e.preventDefault(); //序列化表单数据 var formData=$(this).serialize(); $.post('php.php',formData,function(data){ /*对server返回的数据进行操作*/ }); }); } } ) </script> </body> </html>
JQuery的使用策略:
首先是JQuery中Ajax的基础使用方式:
$.ajax({ url: "ajax_php.php", //不须要加? type: "POST", data:{trans_data:my_data}, //能够直接使用A=B&C=D dataType: "json", //对应的,数据类型能够写成 text error: function(){ alert('Error loading XML document'); }, success: function(data,status){ //假设调用php成功 ,这里一般写一个參数就能够,表示接收的数据 alert(unescape(data));//解码,显示汉字 } });
$('#id').append("<div id='table'></div>");
事实上。这个时候有一个隐患,就是每次异步。页面都会追加一个节点div,这应该是我们不想看到的。我们肯定须要删除之前追加的div了。可是,删除节点的操作。是在$.ajax之前操作呢,还是在success函数内部首行操作呢,
比方说。调用ajax的是一个input元素的blur事件,例如以下
$('input').blur(function(){ $.ajax({}); })
$("#id1,#id2").remove();
仅仅说了client,也须要略微说一下server端,我们向server发送了数据。server通过$_POST之类的接收參数处理之后。怎么返回数据呢?当然,非常多都应该试过了。使用echo【哎扣】。但这样的方式无论怎么。都感觉比較低端,没水平,习惯使用echo返回text的数据。比方。client须要显示一个radiobutton,但前提是server端的这个用户是存在的,这时。我们就传递用户信息到server端。当然使用的是text格式,server端经过处理之后,仅仅须要返回一个
echo 1;//是否显示的Flg
然后就是追加节点了。须要注意的是,要确保echo之后不会再有其它的输出。否则可能会有意想不到的情况,比方,异步返回了整个页面的源码。
怎样指定数据的类型。说的比較宽泛了,事实上我就想记录一下两个属性:
contentType: "application/json; charset=utf-8", dataType: "json",
success: function( response ) { $( "input[ name = type ]:eq( " + response.type + " )" ).attr( "checked", "checked" ); $( "input[ name = name ]" ).val( response.name ); $( "input[ name = fname ]" ).val( response.fname ); $( "input[ name = lname ]" ).val( response.lname ); $( "input[ name = email ]" ).val( response.email ); $( "input[ name = phone ]" ).val( response.phone ); $( "input[ name = website ]" ).val( response.website ); $( "#admin_member_img" ).attr( "src", "images/member_images/" + response.image ); }
data:{ 'name':'fh', 'age':'22' }
当然也能够这么使用:可是以下的有时候不好使,事实上就是个人感觉不怎么好使。并且。我发现假设用这样的GET语句。firebug捕捉不到异步的请求,仅仅能使用抓包工具。这里须要补充一点就是中文的问题,ajax提交跟form表单提交有差别,一般使用encodeURI这个js函数来包装传递的值。
data:"name=fh&age=22"
$ajax({}); console.log(....);
使ajax发送同步请求。默认属性为true,这样就发送同步请求了:
async :false
延续上面的。接着说contentType:官方说:当发送数据到server时。使用这样的指定的数据类型,编码
contentType: "application/json; charset=utf-8", contentType: "application/json",
server端怎么返回,假设还是echo就有点蹩脚了,由于我们返回的时候没有指定返回的文件类型。如今我们以返回json格式的数据来举例。
<?这里假设是在一个函数中,执行是能够的。可是在全局执行的环境中,我还没有试过。php $array=array(); $returnJsonStr=json_encode($array); header("Content-Type:appliation/json;charset=utf-8"); return $returnJsonStr ?>
return和exit在全局的环境中效果是一样的。唯一差别是。exit是终止了全部脚本的执行。而return仅仅是终止了当前文件内脚本的执行。假设return在include文件里引入,引用该文件的脚本并不会停止执行。
标签:client min 期望 success 它的 org remove 出错 get
原文地址:http://www.cnblogs.com/cynchanpin/p/7109627.html