jquery利用ajax调用后台方法实例


Posted in Javascript onAugust 23, 2013
语法:
$(function(){
    var callback = function(r){  //r表示后台数据返回的数据.
    }
    $.get("",callback);   //引号里面写方法的路径
});

这样就可以得到后台方法得到的数据显示在html前端了.

以下是工作中写的一段js和后台方法:

js:

$(function(){
    var callback = function (r) {
        var data = "<marquee width='853;' height='250px;' scrollamount='2' scrolldelay='4' direction='up' behavior='loop' onmouseout='this.start()' onmouseover='this.stop()'><ul>"
        var data2 = "<div class='marquee_div'><span onclick='closeList()'><img src='Images/关闭icon.png' class='closeImg ml_fix_png' /></span>优惠名单</div>";
        for (var i = 0; i < r.length; i++) {
            data += ("<li><label>" + r[i].time + "</label><span>" + r[i].CustomerName + "</span>申请试用成功获得购买年服务年费9折优惠,恭喜!</li>");
        }
        data += "</marquee></ul>";
        $("#01_companys").html(data);
        var t_data2 = "";
        for (var i = 0; i < r.length; i++) {
            if (i % 2 == 0) {
                t_data2 += "</div><div class='listTitle'>";
            }
            t_data2 += "<div style='width:49%; height:40px; line-height:40px; float:left'>" + (i + 1) + "." + r[r.length - i - 1].CustomerName + "</div>";
        }
        $("#01_list").html(data2 + (t_data2.length > 0 ? t_data2.substr(6, t_data2.length - 6) : "") + "</div>");
    }
    $.get("/activity/trycompany", callback);
});

后台代码(mvc4):
public ActionResult TryCompany()
        {
            string CustomerType = Res.CustomerType.TestCustomer.ToString();
            IList<Customers> vlist = o_Res.GetHtmlCustomers(1, 100, out pCount, (a => a.CustomerType == CustomerType));
            var list = vlist.ToList().ConvertAll(s =>
            {
                return new { s.CustomerName, time = s.AddDate.HasValue ? s.AddDate.Value.ToString("MM-dd HH:mm") : "" };
            });
            return Json(list, JsonRequestBehavior.AllowGet);
        }

后台得到一个list,jq调用,遍历,然后显示在前端.

一个很简单的例子,肯定还有更简单的办法,等以后来挖掘.

Javascript 相关文章推荐
javascript实现unicode和字符的互相转换
Jul 18 Javascript
一些常用且实用的原生JavaScript函数
Sep 08 Javascript
基于Jquery的淡入淡出的特效基础练习
Dec 13 Javascript
一个支持任意尺寸的图片上下左右滑动效果
Aug 24 Javascript
javascript中cookie对象用法实例分析
Jan 30 Javascript
快速解决js动态改变dom元素属性后页面及时渲染的问题
Jul 06 Javascript
ionic实现下拉刷新载入数据功能
May 11 Javascript
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
在vue中添加Echarts图表的基本使用教程
Nov 22 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
May 16 Javascript
如何解决React官方脚手架不支持Less的问题(小结)
Sep 12 Javascript
微信小程序实现同时上传多张图片
Feb 03 Javascript
点击进行复制的JS代码实例
Aug 23 #Javascript
关于JS中的闭包浅谈
Aug 23 #Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
Aug 22 #Javascript
仿百度输入框智能提示的js代码
Aug 22 #Javascript
JAVASCRIPT函数作用域和提前声明 分享
Aug 22 #Javascript
JavaScript中的eval()函数详解
Aug 22 #Javascript
from 表单提交返回值用post或者是get方法实现
Aug 21 #Javascript
You might like
PHP 定界符 使用技巧
2009/06/14 PHP
10条PHP高级技巧[修正版]
2011/08/02 PHP
浅析get与post的一些特殊情况
2014/07/28 PHP
phpStudy 2016 使用教程详解(支持PHP7)
2017/10/18 PHP
WEB 浏览器兼容 推荐收藏
2010/05/14 Javascript
javascript笔记 String类replace函数的一些事
2011/09/22 Javascript
兼容FF和IE的动态table示例自写
2013/10/21 Javascript
jQuery Trim去除字符串首尾空字符的实现方法说明
2014/02/11 Javascript
更快的异步执行(setTimeout多浏览器)
2014/08/12 Javascript
JS实现iframe自适应高度的方法(兼容IE与FireFox)
2016/06/24 Javascript
Angular2 (RC5) 路由与导航详解
2016/09/21 Javascript
微信小程序 Record API详解及实例代码
2016/09/30 Javascript
微信小程序 action-sheet底部菜单详解
2016/10/27 Javascript
javascript 中null和undefined区分和比较
2017/04/19 Javascript
webpack打包react项目的实现方法
2018/06/21 Javascript
layui的table单击行勾选checkbox功能方法
2018/08/14 Javascript
详解vue中async-await的使用误区
2018/12/05 Javascript
Vue2.x Todo之自定义指令实现自动聚焦的方法
2019/01/08 Javascript
react配置antd按需加载的使用
2019/02/11 Javascript
vue 中url 链接左边的小图标更改问题
2019/12/30 Javascript
React.js组件实现拖拽排序组件功能过程解析
2020/04/27 Javascript
Python 3.x 新特性及10大变化
2015/06/12 Python
Python访问MongoDB,并且转换成Dataframe的方法
2018/10/15 Python
Python Gitlab Api 使用方法
2019/08/28 Python
使用Python打造一款间谍程序的流程分析
2020/02/21 Python
Europcar葡萄牙:葡萄牙汽车和货车租赁
2017/10/13 全球购物
学雷锋树新风演讲稿
2014/05/10 职场文书
法学专业毕业生求职信
2014/06/12 职场文书
教师党员先进性教育自我剖析材料思想汇报
2014/09/24 职场文书
党员干部四风问题整改措施思想汇报
2014/10/12 职场文书
2015年上半年物业工作总结
2015/03/30 职场文书
python编程实现清理微信重复缓存文件
2021/11/01 Python
python双向链表实例详解
2022/05/25 Python
Redis入门基础常用操作命令整理
2022/06/01 Redis
JS轻量级函数式编程实现XDM二
2022/06/16 Javascript
HTML静态页面获取url参数和UserAgent的实现
2022/08/05 HTML / CSS