jQuery Ajax向某个页面传值并取得返回的数组

本案例讲诉通过Ajax向某个PHP页面传值,并将得到的数组通过json_encode()函数处理,然后返回给ajax,下面是在实际案例摘取的部分代码:

PHP页面

    public function showChatName(){
        $chat = A('Article','Event');
        $res = $chat->selectName(I('get.channel'));
        echo json_encode($res);
    }

数组$res经过json_encode处理后的输出形式

{"channel_name":"abc"}

模板页面

    <script src="../../public/home/js/jquery.min.js"></script>
    <script type="text/javascript">
        //取得cookie值
        function getCookie(name){
            var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
            if(arr=document.cookie.match(reg)){
                return unescape(arr[2]);
            }else{
                return null;
            }
        }
        $(function(){
            var channel = getCookie('channels');
            var a = window.location.host;
            $.ajax({
                type:'GET', //以get方式与后台沟通
                url :'http://'+a+'/Article/showChatName',//与此php页面沟通
                dataType:'json',//从php返回的值以JSON方式解释
                data:'channel='+channel,
                cache:false,
                success:function(msg){//如果调用php成功,注意msg是返回的对象,这个你可以自定义
                    if(msg.channel_name != ''){//channel_name就是数组的一个键值
                        var b = msg.channel_name;
                        $("h1").text(b);
                        return false;
                    }
                }
            });
        });
        </script>
        <body>
            <div id="headlineContainer">
                <h1 id='title_h1'></h1>
            </div>

使用$.cookie(‘channels‘)的时候提示:Object doesn‘t support property or method ‘cookie‘!不知道是怎么回事,所有自己用js写了个获取Cookie的方法,然后直接调用。

点击这里下载演示版

jQuery Ajax向某个页面传值并取得返回的数组,布布扣,bubuko.com

时间: 2024-08-06 07:36:16

jQuery Ajax向某个页面传值并取得返回的数组的相关文章

Jquery ajax不刷新页面提交action取得返回值

页面采用回调函数function(data) 处理后台返回的结果 a标签onclick事件触发 <a  href ="javascript:void(0);" class="btn btn-default"  id ="add" onclick = "return addproduct(${s.id});">加入秒杀</a> 前台 function addproduct(id){   var mpric

jquery.ajax请求aspx和ashx的异同 Jquery Ajax调用aspx页面方法

1.jquery.ajax请求aspx 请求aspx的静态方法要注意一下问题: (1)aspx的后台方法必须静态,而且添加webmethod特性 (2)在ajax方法中contentType必须是"application/json", (3)data传递的数据必须是严格的json数据,如"{'a':'aa','b':'bb'}",而且参数必须和静态方法的参数一 一对应 (4)aspx的后台方法返回的数据默认形式是"{'d':'返回的内容'}",所

Jquery Ajax调用aspx页面方法

原文:Jquery Ajax调用aspx页面方法 在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通过aspx.cs中的静态方法+WebMethod进行处理: 3)文艺玩法:通过WCF进行处理. 第一种和第三种方法不在本文介绍范围之内,下面重点介绍第二种方法. 说明 在我们的印象里 asp.net的Web服务是以.asmx来结尾的,而我们现在的asp.net也能实现Web服务,这是因为默认Web.

jQuery AJAX实现调用页面后台方法

1.新建demo.aspx页面.2.首先在该页面的后台文件demos.aspx.cs中添加引用. using System.Web.Services; 3.无参数的方法调用. 大家注意了,这个版本不能低于.net framework 2.0.2.0已下不支持的.后台代码: [WebMethod] public static string SayHello() { return "Hello Ajax!"; } JS代码: $(function() { $("#btnOK&qu

JQuery ajax 在aspx中传值和取值

传值:ajax中的data(json)  js代码: <script type="text/javascript"> $(function () { $("#btnAddNews").bind("click", function () { var _name= $.trim($("#txtNewTitle").val()); $.ajax({ type: "POST", url: "A

Jquery Ajax调用aspx页面实例

目前,我会的几种asp.net界面与后台代码交互方式有几种: 1.webform+服务器控件交互: 2.webform+jquery+ajax+一般处理程序交互: 3.webform+jquery+ajax+Webservice/WCF交互: 4.MVC: 5.webform+jquery+ajax直接交互: 其中第1种交互是入门级,发展级为第2与第3,交互方式类似,也是我常用的开发方式.第4种最近几年才出现,玩过,用于项目比较少. 现在记录一下第5种交互方式. 第一步:准备页面代码: <!DO

利用jquery.ajax在jsp页面动态生成table,可以增加修改,并支持一行和多行删除

声明:此为本人原创,只想实现功能,界面样式方面没多考虑,很粗糙能看懂就行--2018-5-14 动态生成table,我利用jsp内嵌java代码从后台获取对象集合,输出的时候有2中方法 1.直接利用java代码for(b1 b:bs)输出 2.利用JSTL标签库的c:foreach输出 不同之处在于,利用c:foreach输出要把获取的对象集合加入到request,然后用${}来读取,而for(b1 b:bs)可以直接输出. 第一种方法--for(b1 b:bs)输出<table id="

php+JQuery+Ajax简单实现页面异步刷新

页面显示如下: JQueryAjax.html中的代码如下(用的较为简单的$.post) <html> <head> <meta charset="UTF-8"> <title>JQueryAjax+PHP</title> <script type="text/javascript" src="https://code.jquery.com/jquery-3.0.0.min.js"

Jquery.ajax发送参数调用.Net Mvc子方法返回一个子页面嵌入当前页

前端页面: <div id='预留位置'> </div> $.ajax({            url: '@Url.Action("子方法")',     //调用子方法(child action)            type: 'POST',            data: ({ 参数名称: 值 }),    //注意括号                     dataType: 'html',   //返回html格式            su