利用jQuery操作对象数组Array，JS行政区划数组连动

jQuery对于数组元素操作主要提供了以下工具：（下面关于Jquery使用部分代码的代码源自网络，行政区划连动属原创）

(1)数组和对象的例遍：jQuery.each(obj,callback)

通用例遍方法，可用于例遍对象和数组。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。

（2）数组元素的过滤：jQuery.grep(array,callback,[invert])

使用过滤函数过滤数组元素。此函数至少传递两个参数：待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。

（3）数组元素的查找：jQuery.inArray(value,array)

确定第一个参数在数组中的位置(如果没有找到则返回 -1 )。

（4）删除重复元素：jQuery.unique(array)

删除数组中重复元素。

 

下面的实例通过对象数组的过滤来实现获取或者删除指定属性为指定值的数组元素。

<script src="js/jquery.js" ></script>

<script>

/**
* 从对象数组中删除属性为objPropery，值为objValue元素的对象
* @param Array arrPerson  数组对象
* @param String objPropery  对象的属性
* @param String objPropery  对象的值
* @return Array 过滤后数组
*/
function remove(arrPerson,objPropery,objValue)
{
   return $.grep(arrPerson, function(cur,i){
          return cur[objPropery]!=objValue;
       });
}

/**
* 从对象数组中获取属性为objPropery，值为objValue元素的对象
* @param Array arrPerson  数组对象
* @param String objPropery  对象的属性
* @param String objPropery  对象的值
* @return Array 过滤后的数组
*/
function get(arrPerson,objPropery,objValue)
{
   return $.grep(arrPerson, function(cur,i){
          return cur[objPropery]==objValue;
       });
}

/**
* 显示对象数组信息
* @param String info  提示信息
* @param Array arrPerson  对象数组
*/
function showPersonInfo(info,arrPerson)
{
   $.each(arrPerson, function(index,callback){
         info+="Person id:" + arrPerson[index].id + " name:" + arrPerson[index].name+ " sex:"+ arrPerson[index].sex+" age:"+ arrPerson[index].age+"/r/t";
    });
    alert(info);
}

//测试数据
var arrPerson=new Array();
var person=new Object();
person.id=1;
person.name="帅哥";
person.sex="男";
person.age=30;

arrPerson.push(person);

person=new Object();
person.id=2;
person.name="美眉甲";
person.sex="女";
person.age=28;

arrPerson.push(person);

person=new Object();
person.id=3;
person.name="美眉乙";
person.sex="女";
person.age=20;

arrPerson.push(person);

//测试删除
showPersonInfo("原始数组：/r/t",arrPerson);

arrPerson=remove(arrPerson,"id",1);

showPersonInfo("删除之后：/r/t",arrPerson);

//测试获取
arrPerson=get(arrPerson,"id",3);

showPersonInfo("只获取ID为3的元素：/r/t",arrPerson);

</script>

行政区划连动实例：

    <script language="javascript" src="js/jquery-1.6.1.min.js"></script>
    <script type="text/javascript">
        var menu1 = [
        ['北京市', 2],
        ['河南省', 18],
        ['湖北省', 19],
        ['新疆', 2381]
        ];

        var menu2 = [
        [2, '东城区', 36],
        [2, '西城区', 37],
        [2, '崇文区', 38],
        [2, '昌平区', 48],
        [18, '开封市', 2386],
        [18, '洛阳市', 2406],
        [18, '平顶山市', 2422],
        [18, '焦作市', 2434],
        [2381, '石河子市', 3395],
        [2, '中国', 3435]
        ];

        var menu3 = [
        [2406, '西工区', 2410],
        [2406, '老城区', 2411],
        [2406, '涧西区', 2412],
        [2406, '瀍河回族区', 2413],
        [2406, '洛龙区', 2414],
        [2406, '吉利区', 2415],
        [2406, '偃师市', 2416],
        [2406, '孟津县', 2417],
        [2406, '汝阳县', 2418],
        [2406, '伊川县', 2419],
        [2406, '洛宁县', 2420],
        [2406, '宜阳县', 2421],
        [2406, '新安县', 2423],
        [2406, '栾川县', 2424],
        [2406, '嵩县', 2426]
        ];

        //下面3个变量用于动态记录用户已选择的区划
        var _pronvinceNum;
        var _cityNum;
        var _countyNum;

        function get(arrData, objPropery, objValue) {
            return $.grep(arrData, function (cur, i) {
                return cur[objPropery] == objValue;
            });
        }
        //省（页面初始化时执行）
        function setProvince() {
            var str = '';
            $.each(menu1, function (i, row) {
                str += "<a href='javascript:' οnclick='setCity(" + row[1] + ")'>" + row[0] + "</a>";
            });
            $("#div1").html(str);
        }
        //市（省级被点击时自动执行）
        function setCity(num) {
            _pronvinceNum=num;//记录选择的省级代码
            var tempArr = get(menu2, 0, num);
            var str = '';
            $.each(tempArr, function (i, row) {
                str += "<a href='javascript:' οnclick='setCounty(" + row[2] + ")'>" + row[1] + "</a>";
            });
            $("#div2").html(str);
        }
        //区县（市级被点击时自动执行）
        function setCounty(num) {
            _cityNum=num;//记录选择的市级代码
            var tempArr = get(menu3, 0, num);
            var str = '';
            $.each(tempArr, function (i, row) {
                str += "<a href='javascript:' οnclick='setCountyNum(" + row[2] + ")' >" + row[1] + "</a>";
            });
            $("#div3").html(str);
        }

        //记录选择的区县级代码
        function setCountyNum(num) {
            _countyNum = num;
            alert(_pronvinceNum + "|" + _cityNum + "|" + _countyNum);
        }
        //页面加载完毕后执行
        $(document).ready(function () {
            setProvince();
        });
    </script>

<div id="div1"></div> 
<div id="div2"></div>    
<div id="div3"></div>       

 来源： 万达源科技