在jquery中ajax有很多种地,如果有$.ajax,$.get,$.post等等,下面我来举一些这些函数用用法,各位朋友可参考。
经常用到jquery+ajax/" target="_blank">jquery ajax,但有时候会忘记怎么写,下面做个笔记。 jquery ajax例子:
代码如下 | 复制代码 |
//post 方式 $.ajax({ url : 'test.php', type : 'post', data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象 success : function(data){ //code here... }, fail:function(){ //code here... } }); //get 方式 $.get("test.php", { name: "John", time: "2pm" }, function(data){ //code here... }); //get 方式2 $.ajax({ url : 'test.php', data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象 success : function(data){ //code here... } }); //jquery ajax同步方式 $.ajax({ url : 'test.php', type : 'post', async: false,//使用同步的方式 data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象 success : function(data){ //code here... }, fail:function(){ //code here... } }); |
实例
jQuery Ajax 无刷新表单提交实例
HTML 代码如下,鉴于可移植性,没有写全 HTML 的标记。
代码如下 | 复制代码 |
[html] <?php header(‘Content-Type:text/html;charset=utf-8′); ?> <script type=”text/javascript” src=”http://code.jquery.com/jquery.min.js”></script> <script type=”text/javascript”> $(function() { $(“#subbtn”).click(function() { var params = $(‘input’).serialize(); var url = “你的服务器端 php”; $.ajax({ type: “post”, url: url, dataType: “json”, data: params, success: function(msg){ var tishi = “您提交的姓名为:” + msg.name + “<br /> 您提交的密码为:” + msg.password; $(“#tishi”).html(tishi); $(“#tishi”).css({color: “green”}); } }); }); }); </script> <p><label for=”name”>姓名:</label> <input id=”name” name=”name” type=”text” /> </p> <p><label for=”password”>密码:</label> <input id=”password” name=”password” type=”password” /> </p> <span id=”tishi”></span> <p><input id=”subbtn” type=”button” value=”ajax 测试” /></p> [/html] 服务器 PHP 代码如下 [php] <?php echo json_encode($_POST); [/php] |
ajax通过json获取数据例子
代码如下 | 复制代码 |
<script type=”text/javascript”> $(document).ready(function () { getScatalog(“paidang”, “M06″);
}); function getScatalog(selectid,BaseCode) { if (BaseCode != “”) { $.ajax({ url: “ajax/getCatalogByBasecode.aspx”, data: “code=” + encodeURI(BaseCode), cache: false, datatype: “html”, success: function (context) { fillselect(selectid, context); } }); } else { return “Error”; } } function fillselect(selectid, context) { var listitem=new Array(); listitem = eval(context); for (var i = 0; i < listitem.length; i++) { $(“#” + selectid).append(“<option value=’” + listitem[i]["code"] + “‘>” + listitem[i]["name"] + “</option>”); //为Select追加一个Option(下拉项 ) } } </script> html代码: <select id=”paidang” name=”paidang”> <option value=”" selected>==请选择==</option> </select> |
Ajax:
新建一个.aspx页面删除.aspx页面里的html代码删除,在.aspx.cs里添加如下代码
代码如下 | 复制代码 |
string rq_basecode=null; rq_basecode = Request.QueryString["code"]; if (string.IsNullOrWhiteSpace(rq_basecode)) { Response.Write(“Error”); Response.End(); } BLLCataLog bll_info = new BLLCataLog(); List<Scatalog> lt_info = new List<Scatalog>(); lt_info = bll_info.GetCatalog(rq_basecode,”"); //Response.Write(rq_basecode); if (lt_info.Count > 0) { Response.Write(JsonHelper.ToJson(lt_info)); } else { Response.Write(“Null”); } BLL层的数据: public List<M2Model.Scatalog> GetCatalog(string code, string refcode) { DALCataLog dalcatalog6 = new M2SharpDAL.DALCataLog(); return dalcatalog6.GetCatalog(code, refcode); } |