js裡幾個寫法，第一次寫，記錄一下，js寫法

js裡幾個寫法，第一次寫，記錄一下，js寫法

---恢複內容開始---

1.jsp頁面的樣式

<div class="row cl">
　　<label class="form-label col-xs-4 col-sm-2"style="text-align: right;">車輛屬性：</label>
　　<div class="formControls col-xs-8 col-sm-9">
　　　　<dl class="permission-list">　　　　  <input type="checkbox" value="" name="user-Character-0" id="checkAll"

　　　　

　　　　　//jsp頁面比較兩個list的長度  ： ${fn:length(list1)==fn:length(list2) }，使用fn要在頁面引入<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

　　　　　　<c:if test="${fn:length(autobasic.autoattributeList)==fn:length(autobasic.automappingattrList) }">   checked="checked"      </c:if>
　　　　　　>全選：</label>

　　　　　　</dt>
　　　　<dd>
　　　　<c:forEach items="${autobasic.autoattributeList }" var="autoattribute" varStatus="status">
　　　　<label class="attrcheboxclass">

　　　　//在input中再加入一個foreach迴圈遍曆判斷每個checkbox是否被選中，如果被選中，則在input中添加checked屬性
　　　　<input type="checkbox" class="checkOne" name="checkbox_name" value="${autoattribute.autoattributeId }"
　　　　<c:forEach items="${autobasic.automappingattrList}" var="automappingattr">
　　　　　　<c:if test="${automappingattr.autoattributeId == autoattribute.autoattributeId}">checked="checked"</c:if>
　　　　</c:forEach>
　　　　>
　　　　${autoattribute.name }</label>
　　　　</c:forEach>
　　</dd>
</dl>
</div>
</div>

 　　　　　　效果

 

2.擷取複選框中的值

var idStr = "";
$("input[name='checkbox_name']").each(function(){
　　if($(this).is(":checked")){

　　//這裡用逗號將字串分隔開，傳到後台後再分開取值
　　idStr+=$(this).val()+",";
}
});
entity.temporary = idStr;

下面是後台代碼：

String[] strs = autobasic.getTemporary().split(",");

for (int i = 0; i < strs.length; i++) {
　　temp.setAutoattributeId(Integer.parseInt(strs[i]));

　　儲存入對應的資料庫
　　this.automappingattrService.insert(temp, "Automappingattr");
}

 3.js裡面實現全選和全不選：

checkAll為全選框的id

$("#checkAll").click(function() {

　　當全選框的屬性改變為checked屬性時，所有name為checkbox_name的checkbox迴圈遍曆一次，並且都被選中，此處使用prop。
　　if($(this).is(':checked')) {
　　　　$("input[name='checkbox_name']").each(function(){
　　　　$(this).prop("checked",true);
　　});

　　當全選框由checked被點擊為false時，所有name為checkbox_name的checkbox迴圈遍曆一次，並且都不被選中
　　}else{
　　　　$("input[name='checkbox_name']").each(function(){
　　　　$(this).prop("checked",false);
　　});
　　}
});

當checkBox框被點擊時，遍曆所有的name為checkbox_name的單選框，如果所有的單選框都被選中時，那麼全選框也會被勾選
$("input[name='checkbox_name']").click(function(){
var flag = true;
$("input[name='checkbox_name']").each(function(){
　　if(!$(this).is(":checked")){
　　flag = false;
　　}
});
if(flag==true){
　　$("#checkAll").prop("checked",true);
}else{
　　$("#checkAll").prop("checked",false);
}
});

 

---恢複內容結束---