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. Linux - centos 7 mysql安装

    安装 CentOS Linux release 7.1.1503 (Core)下载地址链接:https://pan.baidu.com/s/1c2rWsbm 密码:5nrt #yum -y insta ...

  2. JQuery和html+css实现鼠标点击放烟花

    <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content= ...

  3. 通过vue-cli3构建一个SSR应用程序

    1.前沿 1.1.什么是SSR SSR(服务端渲染)顾名思义就是将页面在服务端渲染完成后在客户端直接展示. 1.2.客户端渲染与服务端渲染的区别 传统的SPA模式 即客户端渲染的模式 Vue.js构建 ...

  4. Smokeping配置调整

    smokeping两种邮件报警方式 一 .自带sendmail报警 修改这两句话to = 收件邮箱,多个逗号分隔from = smokealert@本机IP /usr/local/smokeping/ ...

  5. 限定filesize的数据泵导入导出操作案例

    使用如下方法导入导出expdp sh/sh dumpfile=ycr_%U.dump directory=exp filesize=2mimpdp sh/sh dumpfile=ycr_%U.dump ...

  6. June 10th 2017 Week 23rd Saturday

    A lot of things, we can be touched, but we can not shed tears. 很多事情,我们可以感动,却不能流泪. Sometimes I was to ...

  7. Docker入门系列之三：如何将dockerfile制作好的镜像发布到Docker hub上

    这个系列的前两篇文章,我们已经把我们的应用成功地在Docker里通过nginx运行了起来,并且用dockerfile里制作好了一个镜像. Docker入门系列之一:在一个Docker容器里运行指定的w ...

  8. Android（java）学习笔记58：Android 英文朗诵

    1. 首先,我先把代码放到下面: package com.himi.speaker; import java.util.Locale; import android.app.Activity; imp ...

  9. linux下时间同步的两种方法分享（转）

    与一个已知的时间服务器同步 代码如下: ntpdate time.nist.gov 其中 time.nist.gov 是一个时间服务器. 删除本地时间并设置时区为上海 复制代码 代码如下: rm -r ...

  10. 小草的Trouble学生信息管理系统

    小草最近上课学C++,在图书馆纠结了好久,决定做这个小东西,没想到遇到了好多困难,好吧,功夫不负有心人,小草也在敲代码中提高了不少. 小草硬是学了好几天,才搞完这个东西,也算是了结了小草的一个心结. ...