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中的客户端消息框架设计原理
Jun 24 Javascript
jquery实现ajax加载超时提示的方法
Jul 23 Javascript
基于JavaScript实现熔岩灯效果导航菜单
Jan 04 Javascript
JavaScript实现大图轮播效果
Jan 11 Javascript
Vue 仿百度搜索功能实现代码
Feb 16 Javascript
angular仿支付宝密码框输入效果
Mar 25 Javascript
使用Vue.js和Flask来构建一个单页的App的示例
Mar 21 Javascript
如何更好的编写js async函数
May 13 Javascript
快速解决处理后台返回json数据格式的问题
Aug 07 Javascript
聊聊鉴权那些事(推荐)
Aug 22 Javascript
解决iView Table组件宽度只变大不变小的问题
Nov 13 Javascript
JavaScript函数柯里化
Nov 07 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/09/09 PHP
基于Zend的Config机制的应用分析
2013/05/02 PHP
php中session退出登陆问题
2014/02/27 PHP
用php守护另一个php进程的例子
2015/02/13 PHP
ThinkPHP连接Oracle数据库
2016/04/22 PHP
phpinfo的知识点总结
2019/10/10 PHP
jquery创建div 实现代码
2009/04/27 Javascript
jQuery Flash/MP3/Video多媒体插件
2010/01/18 Javascript
获取css样式表内样式的js函数currentStyle(IE),defaultView(FF)
2011/02/14 Javascript
JavaScript var声明变量背后的原理示例解析
2013/10/12 Javascript
js判断浏览器类型及设备(移动页面开发)
2015/07/30 Javascript
js 中获取制定的cook信息实现方法
2016/11/19 Javascript
JavaScript中利用for循环遍历数组
2017/01/15 Javascript
jQuery实现搜索页面关键字的功能
2017/02/16 Javascript
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
2017/04/13 jQuery
angular2模块和共享模块详解
2018/04/08 Javascript
vue实现购物车抛物线小球动画效果的方法详解
2019/02/13 Javascript
Vue表单之v-model绑定下拉列表功能
2019/05/14 Javascript
js定义类的方法示例【ES5与ES6】
2019/07/30 Javascript
javaScript把其它类型转换为Number类型
2019/10/13 Javascript
Angular8 简单表单验证的实现示例
2020/06/03 Javascript
Python中无限元素列表的实现方法
2014/08/18 Python
Python实现的购物车功能示例
2018/02/11 Python
python 时间信息“2018-02-04 18:23:35“ 解析成字典形式的结果代码详解
2018/04/19 Python
Flask框架信号用法实例分析
2018/07/24 Python
使用pip发布Python程序的方法步骤
2018/10/11 Python
Python  Django 母版和继承解析
2019/08/09 Python
pytorch实现对输入超过三通道的数据进行训练
2020/01/15 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
电脑教师的教学自我评价
2013/11/26 职场文书
班队活动设计方案
2014/01/30 职场文书
《美丽的田园》教学反思
2014/03/01 职场文书
颁奖晚会主持词
2014/03/25 职场文书
党员对照检查材料思想汇报(党的群众路线)
2014/09/24 职场文书
写给同学的新学期寄语
2015/02/27 职场文书
移除Selenium中window.navigator.webdriver值
2022/06/10 Python