Jquery 獲取Ajax動態加載出的頁面元素
阿新 • • 發佈:2019-01-22
需求:
1 通過頁面初始化函式${function(){}}函式呼叫ajax訪問後臺,得到資料節點
2 通過ajax得到渲染出的資料不新增事件
3 完成checkbox預設選中
$(function(){ $.ajax({ type: 'get', contentType:'application/json;charset=utf-8', dataType:'json', url: '${pageContext.request.contextPath}/author/list.do',//請求後臺資料介面 success: function(res) { if (res!=null) { $("#tt").empty(); //拼接字串完成ckeckbox列表的載入 for(var i=0;i<res.length;i++){ var item =res[i]; var message =""; message += "<dl class='permission-list'>"; message += " <dt>"; message += "<label>"; message += "<input type='checkbox' value='"+item.authorId+"' name='authorId' id='user-Character-1'>" message += item.authorName+"</label>"; message += "</dt> "; message += "<dd>"; message += "<dl class='cl permission-list2'>"; message += "<dd>"; if(item.authorSet!=null && item.authorSet.length>0){ for(var j=0;j<item.authorSet.length;j++){ var ctem = item.authorSet[j]; message += "<label class=''>"; message += "<input type='checkbox' value='"+ctem.authorId+"' name='authorId' id='user-Character-1-0-0'>"; message += ctem.authorName+"</label>"; } } message +="</dd>"; message +="</dl>"; message += "</dd>"; message +=" </dl>"; $("#tt").append(message); } } }, complete:function(){ // 通過complete函式 var cks =$("input[name='authorId']"); // 獲取剛才加載出的所有checkbox集合 var authors =${sessionScope.authorIds} // 獲取後臺資料的角色id集合 console.log(authors); for(var i=0;i<cks.length;i++){ for (var j=0;j<authors.length;j++){ var id = authors[j]; if(cks[i].value == id){ cks[i].checked= true; //設定預設選中 break; } } } } }); });