网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料:

 

标题 JS 实现列表与多选框选择附预览动画
内容
    功能预览
    名单
    2html代码
    <span>
    <tr>
    <td><img onclick="addType()" src="${msUrl}/images/logo/add.png">产品范围:</td>
    <td><select id="selectTypeOne" data-options="required:true">
    <option>一级分类</option>
    </select> <select id="selectTypeTwo" data-options="required:true">
    <option selected="selected">全部</option>
    </select></td>
    </tr>
    <tr height="20px">
    <td></td>
    <td id="typeThree"></td>
    </tr>
    <tr height="30px">
    <td></td>
    <td><span id="typeOneResult"></span><span id="typeOneSubResult"></span>
    <hr /></td>
    </tr>
    </span>
    3js代码
    $('#selectTypeOne').combobox({
    url : config.urlMap.typeList,
    valueField : 'name',
    textField : 'name',
    required : true,
    width : '100',
    onSelect : function(row) {
    typeName1 = row.name
    $('#typeThree').html("");
    $('#typeOneResult').html("");
    $('#typeOneSubResult').html("");
    subTypeName=[];
    $('#selectTypeTwo').combobox({
    url : config.urlMap.typeList + "?parent=" + row.id,
    valueField : 'name',
    textField : 'name',
    width : '100',
    required : true,
    onSelect : function(row) {
    typeName2 = typeName1 + ">" + row.name;
    $.getJSON(config.urlMap.typeList + "?parent=" + row.id, function(data) {
    var typeThreeName = ""
    for (var i = 0; i < data.length; i++) {
    typeThreeName += "<input onclick=clinkType("" + data[i].name + "") name='typeThree' value=" + data[i].name + " type='checkbox'>" + data[i].name
    }
    $('#typeThree').html(typeThreeName);
    $('#typeOneResult').html(typeName2 + ">");
    $('#typeOneSubResult').html("");
    subTypeName=[];
    });
    }
    })
    }
    });
    })
    //删除下标元素方式一
    Array.prototype.remove = function(dx) {
    if (isNaN(dx) || dx > this.length) {
    return false;
    }
    for (var i = 0, n = 0; i < this.length; i++) {
    if (this[i] != this[dx]) {
    this[n++] = this[i]
    }
    }
    this.length -= 1
    }
    //删除数组元素方式二
    Array.prototype.baoremove = function(dx) {
    if (isNaN(dx) || dx > this.length) {
    return false;
    }
    this.splice(dx, 1);
    }
    var subTypeName = [];
    function clinkType(name) {
    var index = subTypeName.indexOf(name)
    if (index == -1) {
    subTypeName.push(name);
    } else {
    subTypeName.baoremove(index);
    }
    $('#typeOneSubResult').html(subTypeName.join(","));
    }
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/20 15:14:15