1.ajax基本语法

<script>

 $(function(){

 $('#sub').click(function(){

  var username=$('#username').val();

  var password=$('#password').val();

  $.ajax({

  type: "post",

  url: "http://xxx/test/demo.php",

  data: {username:username,password:password}, //提交到demo.php的数据

  dataType: "json", //回调函数接收数据的数据格式

  success: function(msg){

   $('#text').empty(); //清空Text里面的所有内容

   var data='';

   if(msg!=''){

   data = eval("("+msg+")"); //将返回的json数据进行解析，并赋给data

   }

   $('#text').html("用户名为：" + data.username + ",密码为：" + data.password); //在#text中输出

   console.log(data); //控制台输出

  },

  error:function(msg){

   console.log(msg);

  }

  });

 });

 })

</script>

2. php端的接收方法

<!--?php

 header('Content-type:text/json;charset=utf-8');

 $username=$_POST['username'];

 $password=$_POST['password'];

 $data='{username:"' . $username . '",password:"' . $password .'"}';//组合成json格式数据

 echo json_encode($data);//输出json数据

?>

3.html端代码demo.html

<!doctype html>

<html lang="en">

<head>

 <meta charset="UTF-8">

 <title>ajaxTest</title>

</head>

<body>

 <input type="text" id="username">

 <input type="text" id="password">

 <button id="sub">查询</button>

 <span id="text"></span><!-- 用以显示返回来的数据，只刷新这部分地方 -->

</body>

<script src="//cdn.bootcss.com/jquery/3.0.0-alpha1/jquery.min.js"></script>

</html>

jQuery Ajax请求后台数据并在前台接收的更多相关文章

  1. 前台返回json数据的常用方式+常用的AJAX请求后台数据方式

    我个人开发常用的如下所示: 之所以像下面这样下,一是前台Ajax,二是为安卓提供接口数据 现在常用的是返回JSON数据,XML的时代一去不复返 JSON相对于XML要轻量级的多 对JSON不是十分熟悉 ...

  2. jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法

    jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...

  3. Ajax请求后台数据

    一.前期准备 安装好XAMPP软件,并运行起来.本文代码是基于XAMPP开发环境,XAMPP是完全免费且易于安装的Apache发行版,其中包含MariaDB.PHP和Perl.XAMPP开放源码包的设 ...

  4. JS 操作 HTML 和 AJAX 请求后台数据

    为某个元素插入值,添加属性,添加子元素 <div class="col-sm-6"> <select class="form-control" ...

  5. ajax 请求后台数据返回异常 及 提示404方法名不存在

    1.正常使用 Ajax 调取后台数据时,提示方法名不存在,Ajax前端正常,方法类bean注入正常,方法注解正常.但参数解析时出现异常. @RequestMapping(value="/ge ...

  6. jquery ajax请求后台 的简单例子

    jQuery.ajax(url,[settings]) 概述 通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax ...

  7. 【Java框架型项目从入门到装逼】第六节 - 用ajax请求后台数据

    这一节我们来说一下如何用ajax提交请求? 我们先不讲ajax的原理,还是先以实战为主,看一下这个东西到底怎么用的? form表单: <!-- 采用post表单提交 --> <for ...

  8. 用Ajax请求后台数据

    我们先不讲ajax的原理,还是先以实战为主,看一下这个东西到底怎么用的? form表单: <%@ page language="java" contentType=" ...

  9. jquery ajax获取后台数据后无法输出

    今天做ajax获取数据,再浏览器的debugger窗口也看到了数据 ajax代码 $('#userSearch').click(function(){ $.get("loadAllUsers ...

随机推荐

  1. 【数据库】7.0 MySQL入门学习（七）——MySQL基本指令：帮助、清除输入、查询等

    1.0 help == ? 帮助指令,查询某个指令的解释.用法.说明等.详情参考博文: [数据库]6.0 MySQL入门学习(六)——MySQL启动与停止.官方手册.文档查询 https://www. ...

  2. 通知：即日起本博客暂停更新，请移步至yanxin8.com获取最新文章

    通知:即日起本博客暂停更新,请移步至yanxin8.com与博主交流及获取最新文章

  3. 【阿里云产品公测】PTS压力测试最低配ECS性能及评测

    PTS是一个性能测试工具,可以使用PTS对自身系统性能在阿里云环境里的状况进行整体评估来找出你的系统性能瓶颈从而优化系统,同时你还可以在了解自己的系统性能指标情况下便于未来新增扩容.在使用PTS前你必 ...

  4. Oracle 修改任何用户的密码

    1.通过sys用户以sysdba身份登陆: 2.修改用户密码:  alter user 用户名 identified by 密码; 比如修改system的密码为 manager : alter use ...

  5. linux配置IP

    1.配置ip的几种方式:   1.使用ifconfig命令(临时配置,重启后失效) 2.使用setup工具(RedHat专有的,不过经本人测试,虚拟机装了centos,也有setup,也可以进行配置, ...

  6. C# winform 跨线程修改界面

    我们可以使用invoke和bengininvoke invoke同步执行一个委托 begininvoke异步执行一个委托

  7. pdf2swf 转换时报错。This file is too complex to render- SWF only supports 65536 shapes at once

    在使用swftools转换pdf 到swf的时候报错,有如下说明:if the pdf contains too many images / shapes, pdf2swf will fail wit ...

  8. python 学习 （迟到的2017小结）

    2017过去了,从前端开发转测试,入行一年多,写了web的UI自动化测试框架,看了python基础教程,核心编程,算是入门python了吧.目前呢,想开发个接口的自动化测试平台.           ...

  9. linux shell中 if else以及大于、小于、等于逻辑表达式介绍

    在linux shell编程中,大多数情况下,可以使用测试命令来对条件进行测试,这里简单的介绍下, 比如比较字符串.判断文件是否存在及是否可读等,通常用"[]"来表示条件测试. 注 ...

  10. Android（java）学习笔记47：通过反射获得构造方法并且使用

    1. 获取字节码文件对象:             Class c = Class.forName("cn.itcast_01.Person"); 2. 获取构造方法       ...