按照自己的方式,先曬下效果圖:

選一個值,那么就在input里面顯示一個,去掉勾選,那么input就會少一個
其實做法很簡單,今天就是快下班了,閑着沒事加篇博客而已,下面帶上代碼。
1.頁面的展示,input,其中prolist是從后台傳過來的modl,從后台查到的數據,放到了request域中,前台進行接下值
<td>近期活動</td>
<td>
<select id="activities" name="activities" data-options="editable:true,width:200" style="width:200px;height:30px"></select>
<div id="sp">
<c:forEach items="${prolist }" var="b">
<input type="checkbox" name="activities" value="${b.id}">
<span>${b.name}</span>
<br />
</c:forEach>
</div>
</td>
2.js代碼展示,附上這些代碼,簡單的多選框就搞定了
$(function() { $('#activities').combo({ required : true, editable : true, multiple : true }); $('#sp').appendTo($('#activities').combo('panel')); $("#sp input") .click( function() { var _value = ""; var _text = ""; $("[name=activities]:input:checked").each(function() { _value += $(this).val() + ","; _text += $(this).next("span").text() + ","; }); //設置下拉選中值 $('#activities').combo('setValue', _value).combo( 'setText', _text); }); });
保存到后台的是id,選了多個的話,就是把這些id進行了拼接,是不是很簡單,代碼就不一一介紹了,需要的話可以直接拷過去
