ajax请求数据以及处理
html
<div class="list-block media-list mp0 mbb" data-infos='infos' style="display: none;">
<div class="searchs">
<input type="search" id="search-phone" placeholder="请输入您要查询的手机号码"/>
<a href="#" id="inqures" class="inqures">查询</a>
</div>
<!-- 盛放数据的容器 -->
<ul id="order-json"></ul>
</div>
json处理函数
function myjson() {
$.post('../statics/js/data.json', {"phones": $("#search-phone").val()}, function (data) {
for (var i = 0; len = data.length, i < len; i++) {
if (data[i].phones == $("#search-phone").val()) {
$("#order-json").append(
"<li data-active='hover' class='itme-infos'><a href='#' class='item-link item-content'><div class='item-media'><img src=" + data[i].img + " style='width: 2.2rem;'></div><div class='item-inner'><div class='item-title-row'> <div class='item-title'>" + data[i].name + "<b class='bi-loac gti'></b><b class='bi-loac renzheng'></b><b class='bi-loac xin'></b></div> </div><div class='item-subtitle bi-par'><span class='bi-phone'></span>" + data[i].phones + "</div><div class='item-subtitle bi-par'><span class='bi-loaction'></span>" + data[i].ips + "</div></div></a><b class='i-link-loacs'></b></li>"
);
}
}
}, 'json');
}
//json数据调用
$('#inqures').click(function () {
$("#order-json").html("");
myjson();
});
//电话号码的查询显示结果
$("#order-json").delegate('li', 'click', function () {
$(this).toggleClass('i-link-active').children('.i-link-loacs').toggleClass('i-link-icon');
});
ajax请求数据以及处理的更多相关文章
- 关于ajax请求数据,并将数据赋值给全局变量的一些解决方法
在使用ajax请求数据是,开始的时候是打算将ajax的数据取出,并赋予给全局变量,但是在实际编码过程中发现并不能将数据赋予给最开始定义的全局变量,出现这个问题的原因是由于ajax异步加载的原因,所以只 ...
- vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询
vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询 基于element Transfer http://element-cn.eleme.io/#/zh-CN/comp ...
- Ajax请求数据的两种方式
ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...
- h5-localStorage实现缓存ajax请求数据
使用背景:要实现每次鼠标hover“能力雷达”,则显示能力雷达图(通过ajax请求数据实现雷达图数据显示),所以每次hover都去请求ajax会影响性能,因此这里要用到本地缓存. 实现: 此处是通过传 ...
- session失效,使用ajax请求数据被拦截,此时正常的处理逻辑是跳到登录界面,而不是界面没有变化(java推断是否是ajax请求)
在登录过滤器中.推断请求是ajax请求还是超链接或者地址栏变化的请求 if (httpServletReq.getHeader("x-requested-with") != nul ...
- 使用Python的Flask框架,结合Highchart,动态渲染图表(Ajax 请求数据接口)
参考链接:https://www.highcharts.com.cn/docs/ajax 参考链接中的示例代码是使用php写的,这里改用python写. 需要注意的地方: 1.接口返回的数据格式,这个 ...
- 关于ajax请求数据后,数据本身的js失效的一些想法
今天遇到一个头疼的问题.我做一个左右翻页效果(客户要求能够无限翻页),所以只能动态请求数据,进行局部刷新操作. 这时候问题就出来了,当我请求翻页的时候,数据通过js填充到div里面,但这些数据,自身带 ...
- js在方法Ajax请求数据来推断,验证无效(OnClientClick="return Method();"),或者直接运行的代码隐藏
function CheckAdd() { var flag = true; $.ajax({ cache: false, async: false, url: "/ajaxpage/get ...
- ajax 请求数据
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 多次ajax请求数据json出错!!
问题描述: 1.对象数据存放在session中,每次从session中取数据 2.jsp初始化完毕调用ajax请求,返回的数据格式出错(返回部分数据,即丢失了部分数据) 解决方案:
随机推荐
- 微软云数据库SQL Azure
- CodeForces 258D Little Elephant and Broken Sorting(期望)
CF258D Little Elephant and Broken Sorting 题意 题意翻译 有一个\(1\sim n\)的排列,会进行\(m\)次操作,操作为交换\(a,b\).每次操作都有\ ...
- 1.前端数据可视化插件:Highcharts、Echarts和D3(区别)
前端数据可视化插件有很多,但我用过的只有Highcharts(https://www.hcharts.cn/).Echarts(http://echarts.baidu.com/)和D3(https: ...
- 12DUILib经典教程(实例)
Duilib经典实例教程:1基本框架:一个简单的Duilib程序一般是下面这个样子的:://Duilib使用设置部分:#pragmaonce:#defineWIN32_LEAN_AND_ME:#def ...
- Censoring【自动AC机】【水题毁我青春】【20190614】
这题简直比注水猪肉还水QAQ. 以前做过KMP的Censoring单串匹配,果断选择自动AC机w 对短串建自动AC机 长串去机子里匹配 用个栈边匹配边弹出 记得弹出一个串后把匹配点指向栈顶就ojbk ...
- 05_Hibernate数据库连接池
一.配置连接池 连接池:连接池是创建和管理数据库连接的缓冲池技术. 优点:合理利用数据库连接资源.简化的编程模式.受控的资源使用. 主流连接池: DBCP(DataBase connection po ...
- [COCI2019] Mobitel
题目 显然不小于\(n\)这个东西我们不是很好搞,考虑正难则反,求出有多少条路径小于\(n\),之后拿\(C_{n+m}^m\)一减就好了 于是状态为\(dp[i][j][k]\)表示到\((i,j) ...
- MathType插件安装
1 安装包下载 版本号:7.4 下载 提取码:fxma 2 安装方法 用安装包内的Key激活即可.软件激活后不能升级. 注意:必须断网或者加入防火墙阻止联网使用! 3 可能遇到的问题 当安装完Math ...
- ES6之主要知识点(八)Symbol
防止属性名的冲突.这就是 ES6 引入Symbol的原因. 它是 JavaScript 语言的第七种数据类型,前六种是:undefined.null.布尔值(Boolean).字符串(String). ...
- intellij idea中去除@Autowired注入对象带来的下划线提示
场景: idea中通过@Autowired注入的对象一直有下划线提示,虽然不影响运行 解决:改变@Autowired的检查级别即可. 快捷键:Ctrl+Alt+s,进入idea设置界面,输入inspe ...