zoukankan      html  css  js  c++  java
  • jquery+ajax获取本地json对应数据

    首先,记得导入jquery.js文件。

    json内容:

    var obj123=[
            {"option":"2,3,9,14,19,24,32","pdc":"1.洗卸凝胶.2、面膜.3、EGF.4、辅酶Q10.5、舒缓眼霜.6、拍拍霜"},
            {"option":"2,4,9,14,19,24,32","pdc":"1.洗卸凝胶.2、面膜.3、EGF.4、辅酶Q10.5、舒缓眼霜.6、拍拍霜"},
            {"option":"2,5,9,14,19,24,32","pdc":"1.洗卸凝胶.2、面膜.3、EGF.4、辅酶Q10.5、舒缓眼霜.6、拍拍霜"},

    ]

    首先,这是前端内容

     

    设置了选中男得到1,选中女得到2,以此推类。

    重点来了:

    function m1(){
            if($("#sex input").is(':checked')){  选中
                $("#con").click(function(){  //获取按钮
                    inp=$("input:checked[class='case']:checked").map(function(index,elem){
                        return $(elem).attr('rote');
                    }).get().join(',');
                    var innp='"' + inp + '"';
                    $.ajax({
                        url: '${pageContext.request.contextPath}/js/tj.json',  //json文件路径
                        type:'GET',
                        data:{"option":innp},
                        dataType:'json',
                        success: function (data) {
                            console.log(1)
                        },
                        error:function(data){
                            console.log(2)
                        }
                    });
                    // console.log(innp);
                    for(var i in obj123){
                        if(JSON.stringify(obj123[i].option) == innp){  //把得到的和json文件里的对比
                            //console.log('yes')
                            console.log(obj123[i].pdc)   //得到后面对应数据
                        }
                    }
                })
            }}
            $(".skin_raw input").click(function(){   //选中的情况下执行方法
                m1();
            })

    有用点个赞(*^▽^*)

  • 相关阅读:
    《图解HTTP》读书笔记
    【译】关于vertical-align你应知道的一切
    【移动端debug-5】可恶的1px万能实现方案
    《编写高质量代码改善JavaScript程序的188个建议》读书笔记
    【移动端debug-4】iOS下setTimeout无法触发focus事件的解决方案
    一张图看懂Function和Object的关系及简述instanceof运算符
    三张图搞懂JavaScript的原型对象与原型链
    一张图看懂encodeURI、encodeURIComponent、decodeURI、decodeURIComponent的区别
    图解call、apply、bind的异同及各种实战应用演示
    centos vm 桥接 --网络配置
  • 原文地址:https://www.cnblogs.com/wangxiaomo/p/11590423.html
Copyright © 2011-2022 走看看