在这里不多说,直接可以运行代码看效果:

代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="../css/layer.css">
<script src="jquery-1.8.3.min.js"></script>
</head>
<body>
<input type="text" id="ipt">
<button id="btn">点击</button>
<script src="layer.js"></script>
<script>
document.getElementById('btn').onclick = function() {
// layer.msg('hello word');
var ipt = document.getElementById('ipt').value; if (!ipt) {//若input的value值为空,则弹出内容
layer.open({
title:'提示',
content:'输入验证码',
skin: 'demo-class'
});
return;//结束函数体
}
$.ajax({
url: '../pages/admin/view/login/login.json',
type: 'post',
dataType: 'json',
data: {
ipt: 'ipt'
},
success:function(res){
layer.msg('提交成功',{icon:1});
console.log(res);
}
})
}
</script> </body>
</html>

  在这里请求的json数据,内容为:

code----表示服务器端传递的状态,即状态为0时,信息为message

{
"code":"0",
"message":"hahah"
}

 相关文件下载,可直接运行查看效果;链接:https://pan.baidu.com/s/17YkdIF9UQHyt_8RrrliRFw 密码:lc71 

ajax请求json中的数据的更多相关文章

  1. 关于使用Ajax请求json数据,@RequestMapping返回中文乱码的几种解决办法

    一.问题描述: 使用ajax请求json数据的时候,无论如何返回的响应编码都是ISO-8859-1类型,因为统一都是utf-8编码,导致出现返回结果中文乱码情况. $.ajax({ type:&quo ...

  2. 二、Ajax请求MVC中数据查询表返回datatable

    一.Ajax请求MVC中数据查询表返回datatable 解决方式 返回list

  3. Ajax获取 Json文件提取数据

    摘自 Ajax获取 Json文件提取数据 1. json文件内容(item.json) [ { "name":"张国立", "sex":&q ...

  4. Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面

    一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...

  5. bootstrap通过ajax请求JSON数据后填充到模态框

    1.   JSP页面中准备模态框 <!-- 详细信息模态框(Modal) --> <div> <div class="modal fade" id=& ...

  6. Ajax请求ashx返回各类数据的常见处理方式

    .请求text数据,在success事件中手动解析 前台: $.ajax({ type: "post", url: "checkFile.ashx", data ...

  7. Ajax 请求头中常见content-type

    四种常见的 POST 提交数据方式 HTTP 协议是以 ASCII 码传输,建立在 TCP/IP 协议之上的应用层规范.规范把 HTTP 请求分为三个部分:状态行.请求头.消息主体.协议规定 POST ...

  8. 想抛就抛:Application_Error中统一处理ajax请求执行中抛出的异常

    女朋友不是想抛就抛,但异常却可以,不信请往下看. 今天在MVC Controller中写代码时,纠结了一下: public async Task<ActionResult> Save(in ...

  9. Ajax请求过程中显示“进度”的简单实现

    Ajax在Web应用中使用得越来越频繁.在进行Ajax调用过程中一般都具有这样的做法:显示一个GIF图片动画表明后台正在工作,同时阻止用户操作本页面(比如Ajax请求通过某个按钮触发,用户不能频繁点击 ...

随机推荐

  1. net core 使用 rabbitmq

    windows环境安装: https://www.cnblogs.com/ericli-ericli/p/5902270.html .NET Core 使用RabbitMQ https://www.c ...

  2. 用vi编辑文件

    原文:https://www.ibm.com/developerworks/library/l-lpic1-103-8/index.html Overview In this article, lea ...

  3. Debug.Assert vs Exception Throwing(转载)

    来源 Q: I've read plenty of articles (and a couple of other similar questions that were posted on Stac ...

  4. 一脸懵逼学习oracle

    oracle的默认用户:system,sys,scott: 1:查看登录的用户名:show user: 2:查看数据字典:dba_users; 3:创建新用户 (1)要连接到Oracle数据库,就需要 ...

  5. KnocoutJs+Mvc+BootStrap 学习笔记(Mvc)

    Mvc   1.Html 增加扩展方法 using System.Web.Mvc; namespace KnockoutBootstrapMvc.Entensions { public static ...

  6. [转]笔记本怎么设置WIfi热点

    https://jingyan.baidu.com/article/335530da4f774019cb41c3eb.html 随着手机的发展,流量的消耗也是大大地增加.虽然很多手机支持wifi,但是 ...

  7. Centos创建定时任务和开机启动运行脚本

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAArYAAADlCAIAAAAp5CPLAAAgAElEQVR4nNS8d3cj15nuW/wq91vc8d ...

  8. form表单总结

    form表单是一个基础的表单控件,最近做扫码登陆使用到,在这里记录一下 <form action="url" method="get" target=&q ...

  9. Codeforces 911F Tree Destruction

    Tree Destruction 先把直径扣出来, 然后每个点都和直径的其中一端组合, 这样可以保证是最优的. #include<bits/stdc++.h> #define LL lon ...

  10. HTML5拖放牛刀小试

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