zoukankan      html  css  js  c++  java
  • 前台实现ajax 需注意的地方

    0x01.

    使用jquery中的 $.post() /$.get() /$.ajax() /$.load() 这是常用的四种ajax与后台交互的方法

    大致思路:

    前台js触发事件 调用jquery函数,向后台提交参数,后台处理数据,返回数据结果集(json格式),前台接送处理需要的信息 赋值到前台页面显示。

    1.前台事件

    click:鼠标的点击事件 应用范围:按钮, 表单提交。。。

    onchange:下拉列表value值的改变 <select><option value=""></select>

    ...

    2.js函数的调用

    ...

    $(function(){

      $("button").click(function(){

        var data= $("#form").val(); //接收的数据 可能是一个或多个

        $.load("url","data",function(response,status){

          if(status=="success"){

            #处理json数据 赋值到html页面中

          }

          if(status=="error"){

            #错误信息

          }

        });

      })

    })

    这里 如果是<select> 中的change事件

    修改为$(function(){

        $("#select").change(function(){

          #....

        })

    })

    3.后端返回json 数据

    public function ajax(){

      .....

      $data["id"]="";

      $data["name"]="";

      $this->ajaxReturn($data); //这里直接调用thinkPHP中的方法

    }

    数据格式:

    单个数据:{"id":"1","name":"xxx"} 

    多个数组数据:{"0":["id":"1","name":"xx"],"1":["id":"2","name":"xxx"],...,}

    有时还会带状态信息:{"0":["id":"1","name":"xx"],"1":["id":"2","name":"xxx"],...,"refer":"","state":""}

    0x02.

    处理json数据 遍历

    ...

  • 相关阅读:
    MySQL Date函数的正确用法
    CentOS tree命令详解
    VMware虚拟机的CentOS无法上网的解决方法
    CentOS安装emacs24.2命令
    【复杂】CentOS 6.4下PXE+Kickstart无人值守安装操作系统
    CentOS定位、查找文件的命令
    CentOS查找目录或文件
    CentOS安装Emacs文本编辑器
    centos6.5的软件安装,用户管理等
    CentOS安装OpenOffice
  • 原文地址:https://www.cnblogs.com/developd/p/4485432.html
Copyright © 2011-2022 走看看