2

我被困在下面，我需要使用Eric Hynds jquery-multiselect插件实现链式多选，我想根据第一个选择（主活动）显示第二个选择 optgroup（子活动），就像这样：http: //jsfiddle.net/UNbvn/。

这是一个输出示例：http: //jsfiddle.net/hsQjh/2/

<head>
<link href="jquery.multiSelect.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.multiSelect.js"></script>

<script>
function filterActivityTriggeredUser(e){ 
if($(e).attr('checked')=='checked'){
    $.userListData.filterActivity.set($(e).attr('value'), true);
    $.providerListData.filterActivity.set($(e).attr('value'), true);
}else{
    $.userListData.filterActivity.set($(e).attr('value'), false);
    $.providerListData.filterActivity.set($(e).attr('value'), false);
}   
}

function filterSubActivityTriggeredUser(e){ 
if($(e).attr('checked')=='checked'){
    $.userListData.filterSubActivity.set($(e).attr('value'), true);
    $.providerListData.filterSubActivity.set($(e).attr('value'), true);
}else{
    $.userListData.filterSubActivity.set($(e).attr('value'), false);
    $.providerListData.filterSubActivity.set($(e).attr('value'), false);
}   
}


$(document).ready(function() {

$("#filterActivity").multiSelect({
    selectAll: false,
    noneSelected: 'All',
    oneOrMoreSelected: '*'
},
filterActivityTriggeredUser);

$("#filterSubActivity").multiSelect({
    selectAll: false,
    noneSelected: 'All',
    oneOrMoreSelected: '*'
},
filterSubActivityTriggeredUser);

});
</script>
</head>

<body>

<div id="inner-main">
<div style="width:270px;float:left;">
Main Activity:
<select id="filterActivity" multiple="multiple" size="10" style="width:220px;">
    <option value=""></option>
    <optgroup label="Producer, Content Creation, Rights Holder">
        <option value="1 - Distributor/Agent" id="main1">1 - Distributor/Agent</option>
        <option value="2 - Producer/Production Company" id="main2">2 - Producer/Production Company</option>
    <optgroup label="Distribution Platforms">
        <option value="3 - TV Channel/Broadcaster" id="main3">3 - TV Channel/Broadcaster</option>
</select>
<br /><br />
Sub Activity:
<select id="filterSubActivity" multiple="multiple" size="15" style="width:220px;">
    <optgroup label="1 - Distributor/Agent" id="sub1">
        <option value="1A - Music and Sound Libraries">1A - Music and Sound Libraries</option>
        <option value="1B - HD Digital Radio">1B - HD Digital Radio</option>

    <optgroup label="2 - Producer/Production Company" id="sub2">
        <option value="2A - Animation/Computer Graphics (CGI)">2A - Animation/Computer Graphics (CGI)</option>
        <option value="2B - Co Production">2B - Co Production</option>
        <option value="2C - Sub Production">2C - Sub Production</option>

    <optgroup label="3 - TV Channel/Broadcaster" id="sub3">
         <option value="3A - Antennas, Transmitter and Towers">3A - Antennas, Transmitter and Towers</option>
        <option value="3B - Cable and Satellite">3B - Cable and Satellite</option>

</select>
</div>
</div>

</body>

任何帮助将不胜感激！

4

0 回答 0