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请求数据以及处理的更多相关文章

  1. 关于ajax请求数据,并将数据赋值给全局变量的一些解决方法

    在使用ajax请求数据是,开始的时候是打算将ajax的数据取出,并赋予给全局变量,但是在实际编码过程中发现并不能将数据赋予给最开始定义的全局变量,出现这个问题的原因是由于ajax异步加载的原因,所以只 ...

  2. vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询

    vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询 基于element Transfer http://element-cn.eleme.io/#/zh-CN/comp ...

  3. Ajax请求数据的两种方式

    ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...

  4. h5-localStorage实现缓存ajax请求数据

    使用背景:要实现每次鼠标hover“能力雷达”,则显示能力雷达图(通过ajax请求数据实现雷达图数据显示),所以每次hover都去请求ajax会影响性能,因此这里要用到本地缓存. 实现: 此处是通过传 ...

  5. session失效,使用ajax请求数据被拦截,此时正常的处理逻辑是跳到登录界面,而不是界面没有变化(java推断是否是ajax请求)

    在登录过滤器中.推断请求是ajax请求还是超链接或者地址栏变化的请求 if (httpServletReq.getHeader("x-requested-with") != nul ...

  6. 使用Python的Flask框架,结合Highchart,动态渲染图表(Ajax 请求数据接口)

    参考链接:https://www.highcharts.com.cn/docs/ajax 参考链接中的示例代码是使用php写的,这里改用python写. 需要注意的地方: 1.接口返回的数据格式,这个 ...

  7. 关于ajax请求数据后,数据本身的js失效的一些想法

    今天遇到一个头疼的问题.我做一个左右翻页效果(客户要求能够无限翻页),所以只能动态请求数据,进行局部刷新操作. 这时候问题就出来了,当我请求翻页的时候,数据通过js填充到div里面,但这些数据,自身带 ...

  8. js在方法Ajax请求数据来推断,验证无效(OnClientClick=&quot;return Method();&quot;),或者直接运行的代码隐藏

    function CheckAdd() { var flag = true; $.ajax({ cache: false, async: false, url: "/ajaxpage/get ...

  9. ajax 请求数据

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  10. 多次ajax请求数据json出错!!

    问题描述: 1.对象数据存放在session中,每次从session中取数据 2.jsp初始化完毕调用ajax请求,返回的数据格式出错(返回部分数据,即丢失了部分数据) 解决方案:

随机推荐

  1. bind()的模拟实现

    上一篇对call和apply的模拟实现做了一个梳理,可参见:模拟实现call.apply,下面将具体研究一下bind啦啦啦 1. bind和call/apply的差别 bind方法会创建一个新函数,返 ...

  2. 【CF622F】The Sum of the k-th Powers (拉格朗日插值法)

    用的dls的板子,因为看不懂调了好久...果然用别人的板子就是这么蛋疼- -|| num数组0~k+1储存了k+2个值,且这k+2个值是自然数i的k次方而不是次方和,dls的板子自己帮你算和的...搞 ...

  3. c# 中反射里的invoke方法的参数

    一个最简单的C#反射实例,首先编写类库如下: namespace ReflectionTest { public class WriteTest { //带参数的公共方法 public void Wr ...

  4. AutoIt自动化编程(1)【转】

    1.运行程序 Run 命令或者函数用来运行外部可执行文件 AU3:Run ( "文件名" [, "工作目录" [, 标志]] ) EXAMPLE: AU3:Ru ...

  5. 转载:Linux命令经典面试题:统计文件中出现次数最多的前10个单词

    1.使用linux命令或者shell实现:文件words存放英文单词,格式为每行一个英文单词(单词可以重复),统计这个文件中出现次数最多的前10个单词 主要考察对sort.uniq命令的使用,相关解释 ...

  6. 学习笔记 css样式

    大小 width:宽度  height:高度 背景 background-color  背景色   background-image  背景图片     background-repeat  背景平铺 ...

  7. nicescroll 使用与配置

    使用// 1. 简单模式,设置html元素滚动 $(document).ready(function() { $("html").niceScroll(); }); // 2. 返 ...

  8. Ionic3 demo TallyBook 实例1

    1.创建项目 ionic start  TallyBook  blank  创建一个空的项目 ionic cordova  platform  add android   添加andorid平台 io ...

  9. php中Cookies

    PHP Cookies cookie 是一种在远程浏览器端储存数据并以此来跟踪和识别用户的机制,PHP 透明地支持 HTTP cookie. cookie 常用于识别用户. Cookie 是什么? c ...

  10. LintCode刷题笔记-- A+B problem

    标签: 位运算 描述 Write a function that add two numbers A and B. You should not use + or any arithmetic ope ...