选择第一个下拉框，第二个跟着刷新数据，实现联动刷新

 <script type="text/javascript">
var dirMap = new Map();
var uppeakMap = new Map();
var downpeakMap = new Map();
var timeMap = new Map();
$(function(){
    debugger
    init();
    var data = ${data};

    initEchart(data)
    //切换方向下拉框
    $("#dirSelect").change(function(){

        var dirid = $(this).val();
        debugger
        var peakid = $("#peaksetionSelect option:selected").val();

        debugger
        createPeakSelect(dirMap.get(dirid));
        getData(peakid,dirid);
    });
    //切换峰段下拉框
    $("#peaksetionSelect").change(function(){

        var peakid = $(this).val();
        var dirid = $("#dirSelect option:selected").val();
        getData(peakid,dirid);
    });
});

function getData(peakid,dirid){
    debugger
    var url = "${ContextPath}/generic/workplan/flush?IntervalList="+$.queryString("IntervalList")+
    "&lineId="+$.queryString("lineId")+"&categoryId="+$.queryString("categoryId")+"&peaksetionId="+peakid+"&dir="+dirid;
    var data = $.ajax({
        url : url,
        async : false,
        type : "POST",
        data : {},
        success: function(data){
            debugger
                if(data) {
                    data = eval("("+data+")");
                    initEchart(data);
                }
            }
    });
}

function createPeakSelect(peakMap){
    var selectPeak=$("#peaksetionSelect");//峰段下拉框
    peakMap.each(function(peakid){
        if(!dirRepeat("peaksetionSelect", peakid)){
            var peakOption=$("<option></option>");
            peakOption.val(peakid);
            peakOption.text(peakMap.get(peakid));
            selectPeak.append(peakOption);

        }
    });
}
function init(){
    var IntervalList = $.queryString("IntervalList");
    IntervalList=JSON.parse(IntervalList); //可以将json字符串转换成json对象 
    var selectObj = $("#dirSelect");//方向下拉框
    var selectPeak=$("#peaksetionSelect");//峰段下拉框
    for(var i =0 ;i<IntervalList.length;i++){
        var peakid = IntervalList[i].PEAK_SECTION;//峰段id
        var peakName=IntervalList[i].PEAK_SECTIONDESC;//峰段名称
        var startTime=IntervalList[i].STARTTIME;//峰段开始时间
//      alert(startTime);
         var endTime=IntervalList[i].ENDTIME;//峰段结束时间
        timeMap.put(peakid,startTime+"-"+endTime);
        var dirid=IntervalList[i].OPM_DIRECTION;//双向id
        var dirName = dirid=="0"?"上行":"下行";//方向返回0，表示是上行，否则下行
        if(dirid=="0"){
            debugger
            if(!uppeakMap.containsKey(peakid)){
                //?放峰段的起始时间吗
                uppeakMap.put(peakid,peakName);
            }
            dirMap.put(dirid,uppeakMap);
        }else{
            debugger
            if(!downpeakMap.containsKey(peakid)){
                downpeakMap.put(peakid,peakName);
            }
            dirMap.put(dirid,downpeakMap);
        }
        //去掉重复
        if(!dirRepeat("dirSelect",dirid)){
            var dirOption = $("<option></option>");
            dirOption.val(dirid);
            dirOption.text(dirName);

            selectObj.append(dirOption);
        }

        if(!dirRepeat("peaksetionSelect", peakid)){
            var peakOption=$("<option></option>");
            peakOption.val(peakid);
            peakOption.text(peakName);
            selectPeak.append(peakOption);

        }

    }
    dirMap.each(function(dir){
        dirMap.get(dir);
    });

}
//去掉重复
function dirRepeat(id,value){
    var returnValue = false;
    $("#"+id+" option").each(function(){
        if($(this).val() == value){
            returnValue = true;
        }
    });
    return returnValue;
}
function initEchart(data){
    debugger
    var stationThro = eval("("+data.throughputMap+")").stationList;
    var throughputList=eval("("+data.throughputMap+")").throughputList;
    var pastThroughputList=eval("("+data.pastCapacityMap+")").pastThroughputList;

    var stationRet=eval("("+data.retMap+")").stationList;
    var countList=eval("("+data.retMap+")").countList;
    var pastCountList=eval("("+data.pastTripsMap+")").pastCountList;

    var stationApp=eval("("+data.approvalMap+")").stationList;
    var approvalList=eval("("+data.approvalMap+")").approvalList;
    var pastApprovalList=eval("("+data.pastApprovalMap+")").pastApprovalList;

    var stationPun=eval("("+data.punctualityRateMap+")").stationList;
    var punctualityRateList=eval("("+data.punctualityRateMap+")").punctualityRateList;
    var pastPunctualityRateList=eval("("+data.pastPunctualityMap+")").pastPunctualityRateList;

    var peakid = $("#peaksetionSelect option:selected").val();
    var time = timeMap.get(peakid);
    //为模块加载器配置echarts的路径，从当前页面链接到echarts.js，定义所需图表路径
    <body>
<h3>运力、满意度分析</h3>
<div >
        <select id="dirSelect" ></select>
        <select id="peaksetionSelect"></select> 

</div>

太长 还不用代码编辑器

你要做的就是一个二级联动，，直接给在第一个下拉框中change事件改变第二个下拉框的值就行了

太长，懒得看，说下思路吧。方法一：把两个下拉框的内容都查出来，放到浏览器缓存，点击第二个下拉框时根据第一个下拉框的内容进行过滤，下拉列表中就是你要的了。方法二：点击第二个下拉框时，把第一个下拉框的值当做参数去请求服务器，获得下拉值。方法三：跟方法二差不多，不过是在第一个选择值之后去更新第二个下拉框下拉列表内容

顶一个，二楼说的对，select绑定change事件，根据选中的值，去查第二个下拉框的数据，用ajax吧，很好玩的

把数据查出来放到list集合中，通过第一个下拉框的onchange="XXX"事件。根据第一张表所选中的字段ID，来联动第个下拉列表的内容

<!-- /* * 说明：将指定下拉列表的选项值清空 * 作者：CodeBit.cn ( http://www.CodeBit.cn ) * * @param {String || Object]} selectObj 目标下拉选框的名称或对象，必须 */ function removeOptions(selectObj) { if (typeof selectObj != 'object') { selectObj = document.getElementById(selectObj); } // 原有选项计数 var len = selectObj.options.length; for (var i=0; i < len; i++) { // 移除当前选项 selectObj.options[0] = null; } } /* * 说明：设置传入的选项值到指定的下拉列表中 * 作者：CodeBit.cn ( http://www.CodeBit.cn ) * * @param {String || Object]} selectObj 目标下拉选框的名称或对象，必须 * @param {Array} optionList 选项值设置 格式：[{txt:'北京', val:'010'}, {txt:'上海', val:'020'}] ，必须 * @param {String} firstOption 第一个选项值，如：“请选择”，可选，值为空 * @param {String} selected 默认选中值，可选 */ function setSelectOption(selectObj, optionList, firstOption, selected) { if (typeof selectObj != 'object') { selectObj = document.getElementById(selectObj); } // 清空选项 removeOptions(selectObj); // 选项计数 var start = 0; // 如果需要添加第一个选项 if (firstOption) { selectObj.options[0] = new Option(firstOption, ''); // 选项计数从 1 开始 start ++; } var len = optionList.length; for (var i=0; i < len; i++) { // 设置 option selectObj.options[start] = new Option(optionList[i].txt, optionList[i].val); // 选中项 if(selected == optionList[i].val) { selectObj.options[start].selected = true; } // 计数加 1 start ++; } } //-->

生成json数据导入页面，然后就是联动的问题了，demo：javascript省市联动示例