jquery中選擇器查詢元素相容IE的小問題
阿新 • • 發佈:2018-12-26
<script id="roleWeekRankData" type="text/html"> <$ for(var i = 0; i < data.length; i++) {$> <tr class="<$if(data[i].rank <= 3) {$><$='tbl_top'$><$}$>" id="tr<$=data[i].accountid$>"> <td> <div> <span><$=data[i].rank$></span> <a href="javascript:;" class="ico_btns add_ico ie6png"></a> <a href="javascript:;" class="ico_btns del_ico ie6png" <$=initDelStyle(data[i].accountid + "")$> ></a> </div> </td> <td><$=data[i].name$></td> <td><$=data[i].totalScore$></td> <td>998</td> <td>99A</td> <td>20</td> <td>1</td> <td>1</td> <td>1</td> </tr> <$ } $> </script>
今天本想在模板的for迴圈中加入隱藏域 然後通過隱藏域的值 去查詢對應td下面的值,後來谷歌是沒有任何問題,缺發現IE下面出現了相容性問題。
在IE下通過$(input[name='xx' + playerid]).siblings("xx") 通過隱藏域去迴圈td 在 IE下 死活都是找不出來的 因為在隱藏域中 input是沒有高度的,
但是在chrome中隱藏域是你寫在的那個元素的位置,這樣就引起了相容性問題。後來改造程式碼去掉隱藏域,把tr上作為查詢節點來查詢下面td的值,
這樣就都能查詢到值了,所以以後遇到這問題的同學可以注意下
var tr = $("#" + players[i]);//維持面板狀態 function updateComparePanel() { var players = $.cookie("comparePlayers"); if(players != null) { if(players != "") { players = players.split(","); var arr = []; for(var i = 0;i < players.length; i++) { var tr = $("#" + players[i]); var rolename = tr.children().eq(1).text(); var json = "{\"rolename\" : \"" + rolename + "\", \"accountid\" : \"" + players[i] + "\"}"; arr.push(json); } var jsonStr = "{\"data\":[" + arr.join(",") + "]}"; var html = template("playerData", $.parseJSON(jsonStr)); $("#player").html(html); $("#compareSize").text(players.length); $(".contrast").show(); } else { $("#compareSize").text(0); $(".contrast").fadeOut(1000); } } }
var rolename = tr.children().eq(1).text();
這兩句就是改造後的值,通過選擇器直接找到tr,再從tr去找下面的元素,避免通過隱藏元素去找其他元素