zoukankan      html  css  js  c++  java
  • $.each()方法,其实挺不错的

    例子为主

    html主要代码

     <div class="fl search">厂商:<select id="firms"><option>请选择</option></select> 品牌:<select id="brandmark"><option>请选择</option></select> 型号:<select id="type"><option>请选择</option></select>

    js:

    $(function(){

    function init(obj){
    return $(obj).html("<option>请选择</option>");
    }
    var goodsData = {
    小米: {小米:"小米3,小米4",红米:"红米note,红米note2"},
    苹果: {iphone:"iphone5,iphone6",ipad:"ipad1,ipad2"},
    魅族: {魅族:"魅族1,魅族2",魅蓝:"魅蓝1,魅蓝note"}
    };
    var f = false;
    var b = false;
    var t = false;
    $.each(goodsData,function(fs){
    $('#firms').append("<option>"+fs+"</option>");

    });
    $('#firms').change(function(){
    f = true;
    init("#brandmark");
    init("#type");
    $.each(goodsData,function(fs,bo){

    if($('#firms option:selected').text() == fs){
    $.each(bo,function(bd,tp){
    $('#brandmark').append("<option>"+bd+"</option>");
    });
    $('#brandmark').change(function(){
    init("#type");
    b = true;
    $.each(bo,function(bd,tp){
    if($('#brandmark option:selected').text() == bd){
    $.each(tp.split(","),function(){
    $('#type').append("<option>"+this+"</option>")
    });
    }
    });
    $('#type').change(function(){
    t = true;
    });
    });
    }
    });
    });
    $('#searchBtn').click(function(){
    if(f&&b&&t){
    var str = "你选择的厂商:";
    str += $('#firms option:selected').text();
    str +="&nbsp;你选择的品牌:";
    str += $('#brandmarkm option:selected').text();
    str +="&nbsp;你选择的型号:";
    str += $('#type option:selected').text();
    $('.showdata').show().html(str);
    }else if(f&&!b&&!t){
    $('.showdata').show().html("请选择品牌和型号");
    }else if(f&&b&&!t){
    $('.showdata').show().html("请选择型号");
    }else{
    $('.showdata').show().html("请选择商品");
    }
    });
    });

  • 相关阅读:
    解决Android的ListView控件滚动时背景变黑
    倒计时实现网页跳转
    java获取当前路径
    JavaScript笔记之面向对象
    Jqery调用WebService(.Net3.5环境下)
    Android开发:TabActivity中onKeyDown无法响应的解决方法
    最近不知道什么时候开始D3D11CreateDevice返回E_FAIL
    C++ allocator及一些影响程序性能的因素
    AOP切面编程 几年前写的,移过来
    Adaptive Transparency
  • 原文地址:https://www.cnblogs.com/Ushadow/p/5678524.html
Copyright © 2011-2022 走看看