最后,在对我自己的问题进行迭代之后,我找到了几乎正确的答案。以下是我在此使用的HTML片段——
<tr>
<td align="center" bgcolor="#BFD5EA" width="30%"><font size="1" face="Verdana"><b>Sales Channel : </b></font></td>
<td bgcolor="#E4E4E4" colspan="5"><font size="1" face="Verdana" width="70%">
~foreach from=$sales_channel item=r`
<input type="checkbox" name="salestype[]" value="~$r.ROLE`" id="~ $r.NAME`" >~$r.NAME`
~/foreach`
</td>
</tr>
<tr style="display: none" id="nafrat"><td align="center" bgcolor="#BFD5EA" width="30%"><font size="1" face="Verdana"><b>List of Executives:</font></b></td>
<td bgcolor="#E4E4E4" colspan="5" width="70%">
<select name="selOnlSrc[]" id="myops" multiple size="10" ><!--@@@@Done-->
~foreach from=$assigner key=k item=r`
~foreach from=$r item=m`
<option id="allexec" value="all" selected>All</option>
<option class="~$k`" class="searchSelect" style="display: none" value="~$m.execid`">~$m.display_name`</option>
~/foreach`
~/foreach`
</select>
</td>
现在最重要的是 jquery 部分——
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"> </script>
<script>
$(document).ready(function() {
$("input[name=salestype[]]:checkbox").click(function() {
var selected = new Array();
$('#nafrat').show();
$("input:checkbox[name=salestype[]]:checked").each(function() {
selected.push($(this).val());
});
$('#myops').children('option').hide();
var btnchk= new Array();
btnchk = $('input:checkbox[name="salestype[]"]:checked');
if (btnchk.length) {
$('#allexec').show();
}
else {
$('#allexec').hide();
$('#nafrat').hide();
}
$.each( selected, function(i, l){
$('.'+l).show();
});
selected = new Array();
btnchk = new Array();
});
</script>
为此,我可以在选择两个或多个复选框时合并下拉列表中的值,并进一步取消选中任何一个,从下面的列表中删除相应的内容。
注意:上面显示的HTML包含smarty标记,还有一些PHP变量,如“$assigner”等。