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 选择文件夹对话框(web)
Jul 07 Javascript
jquery蒙版控件实现代码
Dec 08 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 Javascript
js实现Select头像选择实时预览代码
Aug 17 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
Aug 08 Javascript
JavaScript生成简单等差数列
Nov 28 Javascript
浅谈VUE监听窗口变化事件的问题
Feb 24 Javascript
node.js中express模块创建服务器和http模块客户端发请求
Mar 06 Javascript
使用 js 简单的实现 bind、call 、aplly代码实例
Sep 07 Javascript
将RGB值转换为灰度值的简单算法
Oct 09 Javascript
vue仿淘宝滑动验证码功能(样式模仿)
Dec 10 Javascript
一文带你理解vue创建一个后台管理系统流程(Vue+Element)
May 18 Vue.js
点击进行复制的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
调频问题解答
2021/03/01 无线电
风格模板初级不完全修改教程
2006/10/09 PHP
linux环境apache多端口配置虚拟主机的方法深入介绍
2013/06/09 PHP
php利用单例模式实现日志处理类库
2014/02/10 PHP
php查询mssql出现乱码的解决方法
2014/12/29 PHP
简单谈谈php延迟静态绑定
2016/01/26 PHP
PHP实现的简单组词算法示例
2018/04/10 PHP
PHP连接MySQL数据库的三种方式实例分析【mysql、mysqli、pdo】
2019/11/04 PHP
XRegExp 0.2: Now With Named Capture
2007/11/30 Javascript
提高网站性能之 如何对待JavaScript
2009/10/31 Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
2010/10/17 Javascript
js控制input框只读实现示例
2014/01/20 Javascript
AngularJS指令与控制器之间的交互功能示例
2016/12/14 Javascript
angularjs 实现带查找筛选功能的select下拉框实例
2017/01/11 Javascript
JS拉起或下载app的实现代码
2017/02/22 Javascript
vue渲染时闪烁{{}}的问题及解决方法
2018/03/28 Javascript
jQuery实现日历效果
2020/09/11 jQuery
vue项目页面嵌入代码块vue-prism-editor的实现
2020/10/30 Javascript
vue项目打包后请求地址错误/打包后跨域操作
2020/11/04 Javascript
Python常见数据结构详解
2014/07/24 Python
发布你的Python模块详解
2016/09/15 Python
python RSA加密的示例
2020/12/09 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
HTML5手机端弹出遮罩菜单特效代码
2016/01/27 HTML / CSS
Hunkemöller西班牙:欧洲最大的内衣连锁店
2018/08/15 全球购物
为什么group by 和order by会使查询变慢
2014/05/16 面试题
行政部工作岗位职责范本
2014/03/05 职场文书
领导四风问题整改措施思想汇报
2014/10/13 职场文书
镇党委书记群众路线整改措施思想汇报
2014/10/13 职场文书
贪污受贿检讨书范文
2014/11/19 职场文书
戒赌保证书
2015/05/11 职场文书
普通员工辞职信范文
2015/05/12 职场文书
白银帝国观后感
2015/06/17 职场文书
穆斯林的葬礼读书笔记
2015/06/26 职场文书
煤矿隐患排查制度
2015/08/05 职场文书
python requests模块的使用示例
2021/04/07 Python