1. 程式人生 > >jquery中選擇器查詢元素相容IE的小問題

jquery中選擇器查詢元素相容IE的小問題

<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的值,

這樣就都能查詢到值了,所以以後遇到這問題的同學可以注意下

//維持面板狀態
	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 tr = $("#" + players[i]);
var rolename = tr.children().eq(1).text();

這兩句就是改造後的值,通過選擇器直接找到tr,再從tr去找下面的元素,避免通過隱藏元素去找其他元素