jQuery 定时弹窗 & 表格隔行换色 & 复选框全选 & 省市联动 & 下拉列表左右选择

一:使用JQuery完成页面定时弹出广告

 $(function(){
        $("#myImg").show(3000,function(){
            $("#myImg").hidden();
        });
    });

二:使用JQuery完成表格的隔行换色

<style type="text/css">
        .even{
            background-color: red;
        }
    </style>
    <script>
        $(function(){
            $("table tr:odd").css("color","yellow");
            $("table tr:even").addClass("even");
        });
    </script>

三:使用JQuery完成复选框的全选和全不选效果

//普通写法
    $("#selectAll").click(function(){
        if($("#selectAll").prop("checked") == true){
            $(":checkbox[name = 'ids']").prop("checked",true);
        }else{
            $(":checkbox[name = 'ids']").prop("checked",false);
        }
    });
    简化写法:
    $("#selectAll").click(function(){
        $(":checkbox[name = 'ids']").prop("checked",this.checked);
    });

四:使用JQuery完成省市联动效果

$("#sheng").change(function(){
        $("#shi").get(0).options.length = 1;
        var temp = this.value;//这里的this代表sheng列表
        $.each(arrys,function(i,j){
            if(i == temp){//如果this写这里代表某个一维数组
                $(j).each(function(x,y){
                    $("#shi").append("<option>"+y+"</option>");
                });
            }
        });
    });

五:使用JQuery完成下列列表左右选择

//选中左边列表中某个元素到右边列表
    $("#justRight").click(function(){
        $("#selectLeft option:selected").appendTo("#selectRight")
    });
    //左边列表所有元素到右边列表
    $("#justAllRight").click(function(){
        $("#selectLeft option").appendTo("#selectRight");
    });
    //双击左边列表中某个元素这个元素到右边列表
    $("#selectLeft").dblclick(function(){
        $("option:selected",this).appendTo("#selectRight");
    });